Test Index · Photo Borders · Table of sliced images - Rounded corners · Sliced images and manually linked · Overlap Images · Create a Watermark · Gif Png Transparency · Buttons-Image Links · Image Names · Image Theft · Lake Applet · Other applets · Slideshow1 · Slideshow2 · Slideshow3 · Galleries · DD Thumbnail Viewer · image map · xara thumbnail · Random Image · LOGO BRANDING · Animated Image · photo with sound
Logo Branding
Want your logo to float on the page no matter if you visitor has to scroll all the way down the page you want the logo to appear? This is the code for you!
Check out the dragonfly that stays in the right bottom corner as you scroll down the page. Mouseover it and a message appears in the status bar of the window (bottom left).If you click it, you will be taken to my home page.
 |
The original code can be found on The JavaScript Source and called for 3 separate scripts, one in the head, one in the body, then yet another code placed in your webpage in the body.
THE CODE BELOW IS MODIFIED FOR USE IN CSB:
We combine to 2 codes and modify the second.
 To capture the code, press Select All then COPY the contents. Place code into an insert > HTML (webgem in Trellix)
I have made notes in code below and it will effect functionality!
Use the Select All choice above!
Change blue items to match your image
<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Randy Bennett (rbennett@thezone.net) -->
<!-- Web Site: http//home.thezone.net/~rbennett/utility/javahead.htm -->
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Begin
function setVariables() {
imgwidth=22; // logo width, in pixels
imgheight=22; // logo height, in pixels
if (navigator.appName == "Netscape") {
horz=".left";
vert=".top";
docStyle="document.";
styleDoc="";
innerW="window.innerWidth";
innerH="window.innerHeight";
offsetX="window.pageXOffset";
offsetY="window.pageYOffset";
}
else {
horz=".pixelLeft";
vert=".pixelTop";
docStyle="";
styleDoc=".style";
innerW="document.body.clientWidth";
innerH="document.body.clientHeight";
offsetX="document.body.scrollLeft";
offsetY="document.body.scrollTop";
}
}
function checkLocation() {
objectXY="branding";
var availableX=eval(innerW);
var availableY=eval(innerH);
var currentX=eval(offsetX);
var currentY=eval(offsetY);
x=availableX-(imgwidth+30)+currentX;
y=availableY-(imgheight+20)+currentY;
evalMove();
setTimeout("checkLocation()",10);
}
function evalMove() {
eval(docStyle + objectXY + styleDoc + horz + "=" + x);
eval(docStyle + objectXY + styleDoc + vert + "=" + y);
}
// End -->
</SCRIPT>
|
 To capture the code, press Select All then COPY the contents. Place code into an insert > HTML (webgem in Trellix)
MUST change each gEMDIR to GEMDIR before using code!
I have made notes in code below and it will effect functionality!
Use the Select All choice above!
Change items in red to match your statement in the status bar (lower left corner of window)
Change brown item to the link address...click logo and go to this page!
Change blue items to match your image name and size
Change speed, if needed.
<BODY onload="setVariables(); checkLocation();">
<div id="branding" style="position:absolute; visibility:show; left:255px; top:-50px; z-index:2">
<table width=10 bgcolor=#ffffff><td>
<a href="http://www.samisite.com/webbuild.htm" onmouseover="window.status='Thanks for visiting!';return true" target="_top" onmouseout="window.status='';return true"><center><img src="^GEMDIR/samslogotiny22x22dkbutton.gif" width="22" height="22" border="0"></center></a></font></td>
</table></div>
|
