cross browser marquee

[habman0]

I am using php to dynamically create the content that I want the marquee to display and all is working fine.

What I would like to do is refresh/reload the page once the marquee scrolls through its entire contents once. Why the refresh? Well the information that the marquee is to display updates frequently and I would like display the most up to date information and a refresh will accomplish this nicely.

Also a timed refresh won't suffice since the length of the marquee changes each time it is reloaded.

Here is my marquee.

[jscheuer1]

If you are reloading the page, any forms data will be lost. This idea would best be used in a frame or iframe on your page that contains only the marquee. Any speed set by the user will revert to the default configured speed on reload. That said, here's what to do:

First find this function and change 'false' to 'true' as indicated in red:

function doit(){
if (window.location.reload)
window.location.reload( true );
else if (window.location.replace)
window.location.replace(unescape(location.href))
else
window.location.href=unescape(location.href)
}

Then find this function:

function scrollmarquee(){
if (iedom){
var c1=(direction=='reverse')? (parseInt(cross_marquee.style.left)<parseInt(marqueewidth)) : (parseInt(cross_marquee.style.left)>(actualwidth*(-1)-18));
if (c1)
(direction=='reverse')? cross_marquee.style.left=parseInt(cross_marquee.style.left)+copyspeed+"px" : cross_marquee.style.left=parseInt(cross_marquee.style.left)-copyspeed+"px"
else{
if (alternate)
altM();
(direction=='reverse')? cross_marquee.style.left=8-actualwidth+"px" : cross_marquee.style.left=parseInt(marqueewidth)+8+"px"
}
}
else if (document.layers){
var c1=(direction=='reverse')? (ns_marquee.left<parseInt(marqueewidth)) : (ns_marquee.left>(actualwidth*(-1)-18))
if (c1)
(direction=='reverse')? ns_marquee.left+=copyspeed : ns_marquee.left-=copyspeed
else{
if (alternate)
altM();
(direction=='reverse')? ns_marquee.left=8-actualwidth : ns_marquee.left=parseInt(marqueewidth)+8
}
}
}

Make it look like so:

function scrollmarquee(){
if (iedom){
var c1=(direction=='reverse')? (parseInt(cross_marquee.style.left)<parseInt(marqueewidth)) : (parseInt(cross_marquee.style.left)>(actualwidth*(-1)-18));
if (c1)
(direction=='reverse')? cross_marquee.style.left=parseInt(cross_marquee.style.left)+copyspeed+"px" : cross_marquee.style.left=parseInt(cross_marquee.style.left)-copyspeed+"px"
else{
doit();
}
}
else if (document.layers){
var c1=(direction=='reverse')? (ns_marquee.left<parseInt(marqueewidth)) : (ns_marquee.left>(actualwidth*(-1)-18))
if (c1)
(direction=='reverse')? ns_marquee.left+=copyspeed : ns_marquee.left-=copyspeed
else{
doit();
}
}
}

[jscheuer1]

If you want to preserve the user's configured speed from one refresh to the next, add this to doit():

function doit(){
document.cookie='speed='+copyspeed+'endSpeed'
if (window.location.reload)
window.location.reload( true );
else if (window.location.replace)
window.location.replace(unescape(location.href))
else
window.location.href=unescape(location.href)
}

and this to just below 'NO NEED TO EDIT BELOW THIS LINE':

////NO NEED TO EDIT BELOW THIS LINE////////////
marqueespeed=document.cookie.indexOf('endSpeed')==-1? marqueespeed : parseInt(document.cookie.substr(document.cookie.indexOf('speed=')+6))
marqueecontent='<nobr>'+marqueecontent+'</nobr>'

[habman0]

Thank you Thank you Thank you John. The refresh worked like a charm.

Just one thing about the cookie however.

The cookie remembers its speed upon a page refresh when the page is open in it's own browser however when the scroller is in an iframe then it goes back to it's original speed upon a refresh. BTW I am using the ticker in an iframe.

Is there a special way to implement cookies in an iframe?

Thanks for any help.

[jscheuer1]

I'm still learning about cookies. I imagine that prefixing 'document' with with 'parent.' would do the trick. As it appears that the cookie is being written for the parent document already, only prefixes in the read call may need to be added. You can play with it and see, try (scroll the code block, it adds three prefixes):

////NO NEED TO EDIT BELOW THIS LINE////////////
marqueespeed=parent.document.cookie.indexOf('endSpeed')==-1? marqueespeed : parseInt(parent.document.cookie.substr(parent.document.cookie.indexOf('speed=')+6))
marqueecontent='<nobr>'+marqueecontent+'</nobr>'

If that doesn't 'get it' try this (in addition to the above) as well:

function doit(){
parent.document.cookie='speed='+copyspeed+'endSpeed'
if (window.location.reload)
window.location.reload( true );
else if (window.location.replace)
window.location.replace(unescape(location.href))
else
window.location.href=unescape(location.href)
}

[jscheuer1]

I'm not so sure about that. I think the problem may be my cookie syntax. In a local demo here, it works fine in the iframe without any prefixes. There may be something about your server that is preventing the cookies when the page is live. Or, more likely my cookie code isn't ready for prime time yet. What works locally sometimes does not work live. I'll get back to you on that. It could also be an error in your implementation, or with the use of PHP interfering.

[jscheuer1]

OK, I just tested it live. The cookie works. There could be several reasons why you are not seeing it work. Your browser could have cookies disabled for the domain you put it on. If the PHP is rewriting the page, it may no longer recognize its own cookie (if that is the case, switching them all to the parent may solve this). Can you get it working locally in an iframe using the cookie?

[jscheuer1]

The only speed bug I can see is where you mouseover a pause of the scroller, then out to resume before it has reloaded. If you do that, it will revert to the default or set marqueespeed. To avoid that, what is needed is to change this bit of code:

write('<div style="position:absolute;width:'+marqueewidth+';height:'+marqueeheight+';background-color:'+marqueebgcolor+'" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">')

to:

write('<div style="position:absolute;width:'+marqueewidth+';height:'+marqueeheight+';background-color:'+marqueebgcolor+'" onMouseover="marqueespeed=copyspeed;copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">')

[habman0]

Hi John Thanks for all your work on this.

Can you show me your live page so that I can get some idea where I am going wrong.

Also one other issue. The "refresh" after one scroll, the thing that I thought was working, only works in IE and not in Firefox. In firefox it just keeps trying to reload itself but never loads. Is there something that I did wrong? If not then can how can I get it to work in firefox.


Here is my marquee with refresh only and no cookies.

Thanks again for all your help.



EDITED TO ADD:

I got the cookie working in an Iframe when both the iframe and main frame are on the same domain. Check it out here

However the cookie is not working in an iframe when both the iframe and main frame are on different domains. Check it out here

[jscheuer1]

Here is a demo of it in an iframe with the all code for the marquee and cookie on the page inside the iframe:

http://home.comcast.net/~jscheuer1/side/iframedemo.htm

To make things clearer, as I look over my posts in this thread, I should repeat that in the end, I could find nothing wrong with my original cookie code. That the only problem seemed to be with that line of code from my last post in this thread. I've fixed that in my online demo.

It would actually be more instructive to me if you were to put up a demo of it in an iframe, with the original reload code + the original cookie code I supplied, so I could test if it is misbehaving in the way I suspect or if there is something else at work. Or if you want to jump ahead and see if the code in my new demo works for you as well, that might be better. If it works for you, great! If not, at least we will have the latest code to proceed from in debugging. I am concerned that there might be factors beyond our control at work related to PHP or your server in general but, we can't tell about that yet.