Scroll script fails in Netscape & Mozilla

Forum Moderators: open

Message Too Old, No Replies

Scroll script fails in Netscape & Mozilla

klbacon

12:44 am on Jul 3, 2004 (gmt 0)

Hey all, first time poster here. I've recently been working on my own personal website for my digital portfolio and musical interests. Right now the layout utilizes iFrames and a javascript used to scroll a content layer in the framed page thus avoiding stock scroll bars.

The script was actually borrowed with permission from the author and works just fine in IE and Opera browsers but doesn't respond in Netscape or Firefox. I'm getting no javascript errors and the script works fine on the originating site. I think it may have something to do with a dated checkBrowser function and related object constructor function but my javascript skills are relatively weak and I'm unsure how to correct it.

Rambo Tribble

4:00 am on Jul 3, 2004 (gmt 0)

You're right about the code not taking into account newer, standards-compliant browsers.

Although it's not exactly what you're after, I did this for one of the forum questions and it might give you some ideas. It's kind of quick 'n' dirty, but illustrates the technique. Some one might have a more appropriate piece of code to contribute, though.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Slide demo 05-30-04</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
body{height:100%;margin:0;padding:0;}
div{position:absolute;margin:0;padding:0;}
iframe#ifOne{width:100%;background:#FFF;}
#main{height:100%;width:100%;}
#topDiv{height:100%;width:100%;background:#BCF;}
#botDiv{bottom:0;width:100%;height:10px;background:#DAA;overflow:hidden;text-align:center;}
#widg{position:relative;height:0;width:0;margin:2px auto;padding:0;overflow:hidden;border-left:12px solid #DAA;border-right:12px solid #DAA;border-bottom:6px solid #F00;}
</style>
<script type="text/javascript">
var upDn=0;
var bD;
function setHt(){
bD=document.getElementById("botDiv");
bD.style.height="10px"
}
function sliDiv(){
var stVal=bD.style.height;
if(upDn==0){
var nmVal=stVal.split("p");
var nwVal=Number(nmVal[0])+1;
bD.style.height=String(nwVal)+"px"
if(nwVal>60){
clearInterval(toId);
var wg=document.getElementById("widg");
wg.style.borderBottom="0";
wg.style.borderTop="6px solid #F00";
upDn=1;
}
}
if(upDn==1){
var nmVal=stVal.split("p");
var nwVal=Number(nmVal[0])-1;
bD.style.height=String(nwVal)+"px"
if(nwVal==10){
clearInterval(toId);
var wg=document.getElementById("widg");
wg.style.borderTop="0";
wg.style.borderBottom="6px solid #F00";
upDn=0;
}
}
}
function run_sliDiv(){
toId=setInterval("sliDiv()",8);
}
</script>
</head>
<body onload="setHt();">
<div id="main">
<div id="topDiv">
</div>
<div id="botDiv" onclick="run_sliDiv();">
<div id="widg"></div>
<div style="position:relative;">
<iframe src="" id="ifOne">
</iframe>
</div>
</div>
</div>
</body>
</html>