asked on

java script scroll text

Hi,
I am writing a javascript text scroller. It use
css clip property to create a viewpoint on a moving
layer. The code works well under IE. But has some
issues in NS 4.7. What happened is , the first message
show up, and scrolled. But the second message never show
up. I only know it has something to do with
the statement div.clip.top = cliptop;
if I set div.clip.top=0, the second message will show up.
But of course, the effect is not what I want.
Can somebody help me out.

Thanks a lot. I am giving out all my points.
Sean

//html file
<html>
<head>
<script src=scroll.js>
</script>
</head>
<body onLoad="startTextScroll();">

<div id="msg" style="position:absolute;left:100;top:200; width:150; height:150; z-index: 0; visibility: visible; overflow: hidden;">
<script>
document.write(messages[0]);
</script>
</div>

</body>
</html>

//scroll.js

var isNS = (navigator.appName == "Netscape" && parseInt(navigator.appVersion) >= 4);

var viewpointtop;
var scrollerwidth;
var scrollerheight;
var clipbottom;
var cliptop;

var pause=1000;
var speed=100;

var messages=new Array()

messages[0]='<p> Scrolling Layers</p><p> It is written by Shane Zhang.</P><P>Jun 6, 2002 </P>';
messages[1]='<p>This code uses css clip </p><p>property to create a fix</p><p> viewpoint on a moving layer .</p>';
messages[2]='<p>3. Hope it be of some use to you.</p> Bye bye.';

//the message to showed
i=0;

function setClipWindow (div)
{
if(isNS)
{
div.clip.top = cliptop;
div.clip.bottom = clipbottom ;
div.clip.left = 0 ;
div.clip.right = scrollerwidth ;
}else{
newrect="rect("+cliptop+","+scrollerwidth+","+clipbottom+","+"0)";
div.clip=newrect;
}
}
function moveMsg(div)
{
if (isNS) x=div.top;
else x=div.pixelTop;
if (x>=viewpointtop-scrollerheight)
{
// this is the moving part
if (x>=viewpointtop)
{
//moving in
cliptop=0;
clipbottom+=5;
}
else
{
//moving out
cliptop+=5;
}
if(isNS) div.top-=5;
else div.pixelTop-=5;

setClipWindow(div);

//all mesg show up, pause a while
if(cliptop==5)
{
cliptop=0;
setClipWindow(div);
setTimeout("moveMsg(div)",pause);
cliptop=10;
}
else
setTimeout("moveMsg(div)",speed);
}
else
{
//new message
if (i==messages.length-1)
i=0;
else
i++;
if(isNS)
{
document.msg.document.open();
document.msg.document.write(messages[i]);
document.msg.document.close();
}
else {
document.all["msg"].innerHTML=messages[i];
}
cliptop=0;
clipbottom=5;
if(isNS)
div.top=viewpointtop+scrollerheight;
else
div.pixelTop=viewpointtop+scrollerheight;
setClipWindow(div);
setTimeout("moveMsg(div)",speed);
}
}

function getObjectByName(name) {
return (isNS) ? eval('document.'+name) : eval('document.all.'+name+'.style');
}

function startTextScroll(){
div=getObjectByName("msg");
if(isNS) viewpointtop=div.top;
else viewpointtop=div.pixelTop;
scrollerwidth=150;
scrollerheight=150;
//at the begining show the whole message
cliptop=0;
clipbottom=scrollerheight;
moveMsg(div);
}

knightEknight

what happens if cliptop is undefined the first time the function is called?

try this:

div.clip.top = cliptop||0;

xiaoxiangz

ASKER

The strange thing is
if I do this the code will work under NS 4.7

if(cliptop==0) cliptop=-1;
div.clip.top=cliptop;

ASKER CERTIFIED SOLUTION

knightEknight

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ahosang

No comment has been added lately, so it's time to clean up this TA.
I will leave a recommendation in the Cleanup topic area that this question is:

points to knightEknight
Please leave any comments here within the next seven days.

PLEASE DO NOT ACCEPT THIS COMMENT AS AN ANSWER!

ahosang
EE Cleanup Volunteer

modulo

Finalized as proposed

modulo

Community Support Moderator
Experts Exchange