JavaScript連續滾動 - 在頁面刷新加速

我有一個JavaScript數據股票行情，我試圖在IBM Cognos中實現。我在網上找到了一些代碼，其中我已經做了一些更改以使用我的設置。在頁面加載時，滾動條會以一種速度滾動，但在頁面刷新時，滾動條會加速。我正在嘗試解決這個問題。JavaScript連續滾動 - 在頁面刷新加速

爲了讓我的代碼在IBM Cognos內部工作，我已將代碼添加到包含可變數據的表格對象中。表格中的數據在頁面加載時會顯示月份的數據，但用戶可以選擇他們希望查看的數據的每日視圖 - 使數據集更小（因此頁面上的數據刷新變少）。

下面的代碼顯示了我到目前爲止所做的工作，儘管它說「測試，測試測試」是我在我的變量表中包裝代碼的地方。

我的目標是以連續的速度滾動滾動條，即使在頁面重新加載後也是如此。

我感謝您的反饋！這是我到目前爲止的代碼：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd"> 
<html> 
<head> 
<title></title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<style type="text/css"> 

#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; 
} 

</style> 

<script type="text/javascript"> 

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)<(actualwidth*(-1)+4)) 
cross_marquee.style.left=(parseInt(cross_marquee2.style.left)+actualwidth+4)+"px" 
if (parseInt(cross_marquee2.style.left)<(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 

</script> 
</head> 

<body onload=Scroll();> 

<div style="overflow:hidden"> 
<div id="marqueecontainer" onMouseover="copyspeed=pausespeed;" onMouseout="copyspeed=marqueespeed;"> <span id="vmarquee" style="position: absolute; width: 98%;"><nobr> 
<!--SCROLL CONTENT HERE--> 
<table > 
<tr> 
<td nowrap> 
testing testing testing 
</td> 
</tr> 
</table> 
</nobr></span><span id="vmarquee2" style="position: absolute; width: 98%;"></span></div> </div> 
</body>

來源

2013-07-15 charlotte2483

如果您發佈代碼，某人可能會幫助您修復代碼，但有關在何處查找代碼或庫的建議是無關緊要的。 –

除了脫離主題，我不確定我是否理解你正在努力解決的問題。 – Mathletics

感謝您添加您的代碼。現在問題重新開放。 –

下面的代碼現在的工作！我添加了一個if語句和 - clearInterval（lefttime）;初始化選取框功能。現在代碼在頁面刷新上是一致的，如果用戶選擇了也刷新頁面的提交按鈕。

<html> 
<style type="text/css"> 

#marqueecontainer{ 
position: relative; 
width: 1020px; /*marquee width */ 
height: 30px; /*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; 
} 

</style> 

<script type="text/javascript"> 

var delayb4scroll=300 //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_marquee; 
var cross_marquee2; 
var lefttime; 
var lefttime; 


var Start = 1; 

function scrollmarquee(){ 
if (parseInt(cross_marquee.style.left)<(actualwidth*(-1)+4)) 
    cross_marquee.style.left=(parseInt(cross_marquee2.style.left)+actualwidth+4)+"px" 
else 
    cross_marquee.style.left=parseInt(cross_marquee.style.left)-copyspeed+"px" 
if (parseInt(cross_marquee2.style.left)<(actualwidth*(-1)+4)) 
    cross_marquee2.style.left=(parseInt(cross_marquee.style.left)+actualwidth+4)+"px" 
else  
    cross_marquee2.style.left=parseInt(cross_marquee2.style.left)-copyspeed+"px" 

} 

function initializemarquee(){ 
    if(Start==1) { 
    clearInterval(lefttime); 
    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 
    Start=0; 
    setTimeout('lefttime=setInterval("scrollmarquee()",30)', delayb4scroll) 
    } 
} 

function Scroll() { 
    initializemarquee(); 
}  

//onload = Scroll(); // in Cognos this goes here -- in regular html goes in body tag (below) 


if (window.addEventListener) 
window.addEventListener("load", initializemarquee, false) 
else if (window.attachEvent) 
window.attachEvent("onload", initializemarquee) 
else if (document.getElementById) 
window.onload=initializemarquee 

</script> 
<body onLoad="Scroll()"> 
<div style="overflow:hidden" > 
<div id="marqueecontainer" onMouseover="copyspeed=pausespeed;" onMouseout="copyspeed=marqueespeed;"> <span id="vmarquee" style="position: absolute; width: 98%;"><nobr> 
<!--SCROLL CONTENT HERE--> 
<table > 
<tr> 
<td nowrap> 
test test test test test test 
</td> 
</tr> 
</table> 
</nobr> </span><span id="vmarquee2" style="position: absolute; width: 98%;"></span></div> </div> 
</body> 
</html>

來源

2013-07-18 11:51:28 charlotte2483

JavaScript連續滾動 - 在頁面刷新加速

回答

相關問題