No, I don't believe so.
It can be done with Javascript, though. Kind of a wonky solution, but if you want to try it, it works. Paste this into your pages:
<script type="text/javascript">
var offFromTop=95;
var lnx;
var tID;
var reg;
function setUp(){
if(!!(document.addEventListener)&&!!(window.pageYOffset!='undefined')){
reg=[];
lnx=document.getElementsByTagName('a');
for(var i=0;i<lnx.length;i++){
if(!!(lnx[i].href)){
if(lnx[i].href.indexOf('#')>-1){
lnx[i].addEventListener('click',adjustScroll,false);
reg.push(i);
}
}
}
document.addEventListener('unload',deRef,false);
}
}
function adjustScroll(){
clearTimeout(tID);
tID=setTimeout('window.scrollTo(0,window.pageYOffset-offFromTop)',50);
}
function deRef(){
for(var i=0;i<reg.length;i++){
lnx[reg[i]].removeEventListener('click',adjustScroll,false);
}
lnx=null;
}
window.onload=setUp;
</script>
and change the offFromTop variable to the distance you want the scroll to stop from the top in pixels.
It works fine in Firefox/Mozilla and Opera 7-8, fails silently in IE (which won't be a problem, since IE can't do fixed positioning yet) and other browsers that don't have the properties/methods it uses. It should work in Konquerer and Safari, but I can't say for sure -- I don't have a Mac and my Linux partition is munged right now.
Here's a readymade test page you can copy and paste:
<html>
<head><title></title>
<style type="text/css">
.banner {position:fixed; top:0px; left:20px; width:728px; height:90px}
b {color:#990000}
b a {color:#990000}
.blk {width:200px; border:1px solid #000000; background-color:#ccccff}
#d0 {height:200px}
#d1 {height:800px}
#d2 {height:1000px}
#d3 {height:1000px}
</style>
<script type="text/javascript">
var offFromTop=95;
var lnx;
var tID;
var reg;
function setUp(){
if(!!(document.addEventListener)&&!!(window.pageYOffset!='undefined')){
reg=[];
lnx=document.getElementsByTagName('a');
for(var i=0;i<lnx.length;i++){
if(!!(lnx[i].href)){
if(lnx[i].href.indexOf('#')>-1){
lnx[i].addEventListener('click',adjustScroll,false);
reg.push(i);
}
}
}
document.addEventListener('unload',deRef,false);
}
}
function adjustScroll(){
clearTimeout(tID);
tID=setTimeout('window.scrollTo(0,window.pageYOffset-offFromTop)',50);
}
function deRef(){
for(var i=0;i<reg.length;i++){
lnx[reg[i]].removeEventListener('click',adjustScroll,false);
}
lnx=null;
}
window.onload=setUp;
</script>
</head>
<body>
<img class="banner" src="banner.gif" />
<div id="d0" class="blk"></div>
<b><a href="#one">GO TO ANCHOR ONE</a></b><br />
<b><a href="#two">GO TO ANCHOR TWO</a></b><br />
<b><a href="#three">GO TO ANCHOR THREE</a></b><br />
<div id="d1" class="blk"></div>
<a name="one"><b>--------- ONE ---------</b></a><br />
<div id="d2" class="blk"></div>
<a name="two"><b>--------- TWO ---------</b></a><br />
<div id="d3" class="blk"></div>
<a name="three"><b> --------- THREE ---------</b></a><br />
<div id="d4" class="blk"></div>
</body>
</html>
Just change the image source to point to your logo, the image dimensions in the CSS, and the offFromTop value.
Printer-friendly format
Email this thread to a friend
Bookmark this thread
(738 posts)
Send PM |
Profile |
Ignore
