homepage Welcome to WebmasterWorld Guest from 54.227.41.242
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / WebmasterWorld / New To Web Development
Forum Library, Charter, Moderators: brotherhood of lan & mack

New To Web Development Forum

    
Non-scrolling IMG or DIV
fixed DIV
opyate




msg:961332
 1:26 pm on Apr 16, 2003 (gmt 0)

Good day everyone!
We all know that w3c compliancy is a dream still to come true, and a lot of us would like to fix DIVs or IMGs. The option in Opera and NS6 is 'fixed', but in IE this doesn't work.
I also know the option to this is the following piece of code:

<fixed-start>
<script language="javascript">
if (document.images)var staticlogo=new Image(50,50);
staticlogo.src="http://www.websiteaddres.com/myimage.gif";
var logolink="http://www.websiteaddres.com";
var alttext="popup text";
var fadeintoview=1;
var visibleduration=0;

function regenerate(){
window.location.reload()
}

function regenerate2(){
if (document.layers)
setTimeout("window.onresize=regenerate",400)
}

var fadeset='';
if (fadeintoview);
fadeset="filter:alpha(opacity=3)";
if (document.all)
document.write('<span id="logo" style="'+fadeset+';position:absolute;top:100;width:'+staticlogo.width+';height:'+staticlogo.height+'"></span>')

function bringintoview(){
if (logo.filters.alpha.opacity<=95)
logo.filters.alpha.opacity+=5;
else{
clearInterval(viewit);
if (visibleduration!=0)
setTimeout("logo.style.visibility='hidden'",visibleduration*1000)
}
}

function createlogo(){
staticimage=new Layer(100);
staticimage.left=-300;
staticimage.top=120;
staticimage.document.write('<a href="'+logolink+'"><img src="'+staticlogo.src+'" border=0 alt="'+alttext+'"></a>');
staticimage.document.close();
staticimage.visibility="show";
regenerate2();
staticitns()
}

if (document.layers)
window.onload=createlogo;
if (document.all){
w=document.body.clientWidth-logo.style.pixelWidth-25;
h=document.body.clientHeight-logo.style.pixelHeight-10;
logo.style.left=w;
logo.style.top=h;
}

function logoit(){
var w2=document.body.scrollLeft+w;
var h2=document.body.scrollTop+h;
logo.style.left=w2;
logo.style.top=h2
}

function logoit2(){
staticimage.left=pageXOffset+window.innerWidth-staticimage.document.width-15;
staticimage.top=pageYOffset+window.innerHeight-staticimage.document.height
}

function insertimage(){
logo.innerHTML='<a href="'+logolink+'"><img src="'+staticlogo.src+'" border=0 alt="'+alttext+'"></a>';
if (fadeintoview)
viewit=setInterval("bringintoview()",100);
else{
if (visibleduration!=0);
setTimeout("logo.style.visibility='hidden'",visibleduration*1000)
}
}

if (document.all){
window.onscroll=logoit;
window.onresize=new Function("window.location.reload()");
window.onload=insertimage
}

function staticitns(){
setInterval("logoit2()",90);
if (visibleduration!=0);
setTimeout("staticimage.visibility='hide'",visibleduration*1000)
}
</script>

<fixed-end>

The problem with this code, though, is that it is jittery. The image flashes when you scroll.

I would like to know if there is any alternative. I've searched high and low and couldn't find suitable code.

-----I've seen on some sites, that if you scroll, the image stays where it is (it even goes out of page's scope if you scroll too far) until you stop scrolling, and then it smoothly drops into place.-----

Thanks in advance! :)

 

grahamstewart




msg:961333
 11:17 pm on Apr 16, 2003 (gmt 0)

> viewit=setInterval("bringintoview()",100);

Try increasing the number on this line to 1000.
That should increase the amount of time it waits before moving the 'fixed' logo, which should stop it flashing so much.

(but yeah, it would be nice if Microsoft got its finger out and sorted fixed positioning, and PNG support, and...)

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / WebmasterWorld / New To Web Development
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved