title: Javascript Continuous Scroller - speeding up on a page refresh
body: <p>I have a javascript data ticker that I am trying to implement in IBM Cognos.  I have found some code online, in which I have made a few changes to work with my setup.  On a page load, the ticker is scrolling at one speed, but on a page refresh, the ticker speeds up.  I am trying to resolve this issue.</p>
  
  <p>To get my ticker to work inside of IBM Cognos, I have added my code in blocks around a table object that contains variable data.  The data inside the table, on page load shows data for the month, but then the user can choose a daily view of the data in which they would like to see - making the data set smaller (so the data on a page refresh becomes less).</p>
  
  <p>The code below shows what I have done so far, although, where it says "testing, testing testing" that is where I am wrapping this code around my variable table.</p>
  
  <p>My goal is to have the ticker scroll at a continuous speed, even after a page reload.</p>
  
  <p>I appreciate you feedback!  Here is my code so far:</p>
  
  <pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd"&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;&lt;/title&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"&gt;
  &lt;style type="text/css"&gt;
  
  #marqueecontainer{
  position: relative;
  width: 1020px; /*marquee width */
  height: 23px; /*marquee height */
  background-color:#FFF;
  color:black;
  overflow: hidden;
  border: 1px #FFF;
  padding: 2px;
  padding-left: 4px;
  text-align:left;
  }
  
  #marqueecontainer img {
  border-width:2px;
  border-style:solid;
  }
  
  &lt;/style&gt;
  
  &lt;script type="text/javascript"&gt;
  
  var delayb4scroll=2000 //Specify initial delay before marquee starts to scroll on page (2000=2 seconds)
  var marqueespeed=1 //Specify marquee scroll speed (larger is faster 1-10)
  var pauseit=1 //Pause marquee onMousever (0=no. 1=yes)?
  
  
  var copyspeed=marqueespeed // marqueespeed = 1
  var pausespeed=(pauseit==0)? copyspeed: 0 // if pauseit = 0 then pausespeed = copyspeed if not then pausespeed = 0
  var actualwidth='' // actualwidth is undefined
  
  var cross_marque;
  var cross_marque2;
  
  var Start = 1
  
  function scrollmarquee(){
  if (parseInt(cross_marquee.style.left)&lt;(actualwidth*(-1)+4))
  cross_marquee.style.left=(parseInt(cross_marquee2.style.left)+actualwidth+4)+"px"
  if (parseInt(cross_marquee2.style.left)&lt;(actualwidth*(-1)+4))
  cross_marquee2.style.left=(parseInt(cross_marquee.style.left)+actualwidth+4)+"px"
  cross_marquee2.style.left=parseInt(cross_marquee2.style.left)-copyspeed+"px"
  cross_marquee.style.left=parseInt(cross_marquee.style.left)-copyspeed+"px"
  }
  
  function initializemarquee(){
  cross_marquee=document.getElementById("vmarquee")
  cross_marquee2=document.getElementById("vmarquee2")
  cross_marquee.style.left=0
  //marqueewidth=document.getElementById("marqueecontainer").offsetWidth 
  actualwidth=cross_marquee.firstChild.offsetWidth    
  cross_marquee2.style.left=actualwidth+4+'px'
  cross_marquee2.innerHTML=cross_marquee.innerHTML
  setTimeout('lefttime=setInterval("scrollmarquee()",30)', delayb4scroll)
  }
  
  function Scroll(){
  if(Start==1)
  {initializemarquee();}
  else
  {Start=0;}
  }
  
  if (window.addEventListener)
  window.addEventListener("load", initializemarquee, false)
  else if (window.attachEvent)
  window.attachEvent("onload", initializemarquee)
  else if (document.getElementById)
  window.onload=initializemarquee
  
  &lt;/script&gt;
  &lt;/head&gt; 
  
  &lt;body onload=Scroll();&gt;
  
  &lt;div style="overflow:hidden"&gt;
  &lt;div id="marqueecontainer" onMouseover="copyspeed=pausespeed;"  onMouseout="copyspeed=marqueespeed;"&gt; &lt;span id="vmarquee" style="position: absolute; width: 98%;"&gt;&lt;nobr&gt;
   &lt;!--SCROLL CONTENT HERE--&gt; 
  &lt;table &gt;
  &lt;tr&gt;
  &lt;td nowrap&gt;
  testing testing testing
  &lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/nobr&gt;&lt;/span&gt;&lt;span id="vmarquee2" style="position: absolute; width: 98%;"&gt;&lt;/span&gt;&lt;/div&gt; &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>