I am setting up a "framed" site in FP2K and I want to put a "Back to Top" button in the left (contents) frame so that it makes the main page scroll back to the top. It would be nicer than putting them all over each page! Does anyone know how?
Tek-Tips is the largest IT community on the Internet today!
Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!
-
Congratulations IamaSherpa on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!
Back to Top button 1
- Thread starter turbokawi
- Start date
-
1
- #2
I'll help you. I've done it on one of my pages. This one will follow you as you scroll up or down on each page. Put the following code in between the <head> tags:
<head>
<style>
#watermark {
font-family:Arial;
font-size:8pt;
color:FFFFFF;
}
A {
color:White;
}
A:Active {
color:AAAAAA;
}
A:Hover {
color:000000;
}
</style>
</head>
Put this next piece in the body. You can make it the last piece before the ending body tag </body>:
<body>
<DIV id="waterMark" style="position:absolute"><a href="#" onClick="window.scrollTo(0,0)"><img src="Images/top0112.gif" border="0" width="46" height="36"></a></DIV>
<script language="JavaScript1.2">
<!--
// Based on watermark script by Paul Anderson, CNET Builder.com. All rights reserved.
markW = 90; // pixels wide
markH = 40; // pixels high
markX = 99; // percent right
markY = 99; // percent down
markRefresh = 50; // milliseconds
// set common object reference
if (!document.all) document.all = document;
if (!document.all.waterMark.style) document.all.waterMark.style = document.all.waterMark;
wMark = document.all.waterMark.style;
wMark.width = markW;
wMark.height = markH;
navDOM = window.innerHeight; // Nav DOM flag
function setVals() {
barW = 0; // scrollbar compensation for PC Nav
barH = 0;
if (navDOM) {
if (document.height > innerHeight) barW = 20;
if (document.width > innerWidth) barH = 20;
} else {
innerWidth = document.body.clientWidth;
innerHeight = document.body.clientHeight;
}
posX = ((innerWidth - markW)-barW) * (markX/100);
posY = ((innerHeight - markH)-barH) * (markY/100);
}
function wRefresh() {
wMark.left = posX + (navDOM?pageXOffset:document.body.scrollLeft);
wMark.top = posY + (navDOM?pageYOffset:document.body.scrollTop);
}
function markMe() {
setVals();
window.onresize=setVals;
markID = setInterval ("wRefresh()",markRefresh);
}
window.onload=markMe; // safety for Mac IE4.5
//-->
</script>
</body>
Note: In the DIV ID part, you will specify what image you will be using. You will notice in the script above, in that part, I am using the image with this name: top0112.gif. You can use any image you want, and you have the flexibility of changing the size of it.
I hope this helps.
<head>
<style>
#watermark {
font-family:Arial;
font-size:8pt;
color:FFFFFF;
}
A {
color:White;
}
A:Active {
color:AAAAAA;
}
A:Hover {
color:000000;
}
</style>
</head>
Put this next piece in the body. You can make it the last piece before the ending body tag </body>:
<body>
<DIV id="waterMark" style="position:absolute"><a href="#" onClick="window.scrollTo(0,0)"><img src="Images/top0112.gif" border="0" width="46" height="36"></a></DIV>
<script language="JavaScript1.2">
<!--
// Based on watermark script by Paul Anderson, CNET Builder.com. All rights reserved.
markW = 90; // pixels wide
markH = 40; // pixels high
markX = 99; // percent right
markY = 99; // percent down
markRefresh = 50; // milliseconds
// set common object reference
if (!document.all) document.all = document;
if (!document.all.waterMark.style) document.all.waterMark.style = document.all.waterMark;
wMark = document.all.waterMark.style;
wMark.width = markW;
wMark.height = markH;
navDOM = window.innerHeight; // Nav DOM flag
function setVals() {
barW = 0; // scrollbar compensation for PC Nav
barH = 0;
if (navDOM) {
if (document.height > innerHeight) barW = 20;
if (document.width > innerWidth) barH = 20;
} else {
innerWidth = document.body.clientWidth;
innerHeight = document.body.clientHeight;
}
posX = ((innerWidth - markW)-barW) * (markX/100);
posY = ((innerHeight - markH)-barH) * (markY/100);
}
function wRefresh() {
wMark.left = posX + (navDOM?pageXOffset:document.body.scrollLeft);
wMark.top = posY + (navDOM?pageYOffset:document.body.scrollTop);
}
function markMe() {
setVals();
window.onresize=setVals;
markID = setInterval ("wRefresh()",markRefresh);
}
window.onload=markMe; // safety for Mac IE4.5
//-->
</script>
</body>
Note: In the DIV ID part, you will specify what image you will be using. You will notice in the script above, in that part, I am using the image with this name: top0112.gif. You can use any image you want, and you have the flexibility of changing the size of it.
I hope this helps.
- Status
Similar threads
- Locked
- Question
- Locked
- Question