在2个不同的div中滚动垂直文本

时间:2010-01-19 17:37:44

标签: javascript

我想在启动页面时滚动2 div。我添加了onload事件,但它停在这里:

var cross_marquee=document.getElementById(marque)
cross_marquee.style.top=0

有人可以帮助我吗?

代码是:

var delayb4scroll=2000
var marqueespeed=1
var pauseit=0

var copyspeed=marqueespeed
var pausespeed=(pauseit==0)? copyspeed: 0
var actualheight=''
var actualheightDiv2=''

function scrollmarquee(){
if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8))
cross_marquee.style.top=parseInt(cross_marquee.sty le.top)-copyspeed+"px"
else
cross_marquee.style.top=parseInt(marqueeheight)+8+ "px"
}

function initializemarquee(marque, container){
var cross_marquee=document.getElementById(marque)
cross_marquee.style.top=0
marqueeheight=document.getElementById(container).o ffsetHeight
actualheight=cross_marquee.offsetHeight
if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1){ //if Opera or Netscape 7x, add scrollbars to scroll and exit
cross_marquee.style.height=marqueeheight+"px"
cross_marquee.style.overflow="scroll"
return
}
setTimeout('lefttime=setInterval("scrollmarquee()" ,30)', delayb4scroll)
}

window.onload=initializemarquee('wtvmarquee', 'wtmarqueecontainer')
window.onload=initializemarquee("wtvmarqueeDiv2", "wtmarqueecontainerDiv2")

2 个答案:

答案 0 :(得分:1)

你正在覆盖onload事件。

创建一个初始化两个marquees的函数:


window.onload = function(e)
{
  initializemarquee('wtvmarquee', 'wtmarqueecontainer');
  initializemarquee("wtvmarqueeDiv2", "wtmarqueecontainerDiv2");
}

此外,不应该是cross_marquee.style.top="0px"

答案 1 :(得分:1)

刚刚找到另一个代码并将其修改为我的情况,并且正在运行:) Tks for the help joel;)

<style type="text/css">
          .scrollBox {
               /* The box displaying the scrolling content */
               position: absolute;
               top: 30px;
               left: 200px;
               width: 180px;
               height: 200px;
               border: 1px dashed #aaaaaa;
               overflow: hidden;
             }
          .scrollTxt {
              /* the box that actually contains our content */
               font: normal 12px sans-serif;
               position: relative;
               top: 200px;
              }

              .scrollBox2 {
               /* The box displaying the scrolling content */
               position: absolute;
               top: 300px;
               left: 200px;
               width: 180px;
               height: 200px;
               border: 1px dashed #aaaaaa;
               overflow: hidden;
             }
          .scrollTxt2 {
              /* the box that actually contains our content */
               font: normal 12px sans-serif;
               position: relative;
               top: 470px;
              }
        </style>

        <script type="text/javascript">
             var scrollSpeed =1;   // number of pixels to change every frame
             var scrollDepth =200; // height of your display box
             var scrollHeight=0;   // this will hold the height of your content
             var scrollDelay=38;  // delay between movements.

             var scrollPos=scrollDepth; // current scroll position
             var scrollMov=scrollSpeed; // for stop&start of scroll
             var scrollPos2=scrollDepth; // current scroll position
             var scrollMov2=scrollSpeed; // for stop&start of scroll

             function doScroll() {
                  if(scrollHeight==0) { getHeight(); }
                  scrollPos-=scrollMov;
                  if(scrollPos< (0-scrollHeight)) { scrollPos=scrollDepth; }
                  document.getElementById('scrollTxt').style.top=scrollPos+'px';
                  setTimeout('doScroll();', scrollDelay);
             }

             function getHeight() {
                scrollHeight=document.getElementById('scrollTxt').offsetHeight;
             }

             function doScroll2() {
                  if(scrollHeight==0) { getHeight2(); }
                  scrollPos2 -= scrollMov2;
                  if(scrollPos2< (0-scrollHeight)) { scrollPos2=scrollDepth; }
                  document.getElementById('scrollTxt2').style.top=scrollPos2 +'px';
                  setTimeout('doScroll2();', scrollDelay);
             }

             function getHeight2() {
                scrollHeight=document.getElementById('scrollTxt2').offsetHeight;
             }
                window.onload = function(e)
        {
          doScroll();
          doScroll2();
        }

        </script>