2013-07-15 5 views
0

У меня есть код данных javascript, который я пытаюсь реализовать в IBM Cognos. Я нашел код в Интернете, в котором я сделал несколько изменений для работы с моей настройкой. При загрузке страницы тикер прокручивается с одной скоростью, но при обновлении страницы тикер ускоряется. Я пытаюсь решить эту проблему.Javascript Continuous Scroller - ускорение обновления страницы

Чтобы заставить мой тикер работать внутри 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> 
+1

Возможно, кто-то может помочь вам исправить свой код, если вы публикуете его, но рекомендации по тому, где найти код или библиотеку, не соответствуют теме. –

+0

В дополнение к тому, чтобы быть вне темы, я не уверен, что понимаю проблему, которую вы пытаетесь решить. – Mathletics

+1

Спасибо за добавление кода. Теперь вопрос возобновлен. –

ответ

1

Следующий код в настоящее время работает! Я добавил оператор 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>