Results 1 to 2 of 2

Thread: Cross Browser marquee II - Content start again before first cycle

  1. #1
    Join Date
    Oct 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Post Cross Browser marquee II - Content start again before first cycle

    1) Script Title:

    Cross Browser marquee II

    2) Script URL (on DD):

    http://www.dynamicdrive.com/dynamicindex2/cmarquee2.htm

    3) Describe problem:

    I am currently using the above script on a site I am working on. It work's perfectly fine with content I have entered into it.

    I want to know if you can make the content start scrolling again before the first lot of content has completed its cycle. Currently the content scrolls and there is a large empty section on a side bar while the script waits for the end of the content to finish.

  2. #2
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <style type="text/css">
    
    #marqueecontainer{
    position: relative;
    width: 200px; /*marquee width */
    height: 200px; /*marquee height */
    background-color: white;
    overflow:hidden;
    border: 3px solid orange;
    padding: 2px;
    padding-left: 4px;
    }
    
    #marqueecontainer2{
    position: relative;
    width: 200px; /*marquee width */
    height: 200px; /*marquee height */
    background-color: white;
    overflow:hidden;
    border: 3px solid orange;
    padding: 2px;
    padding-left: 4px;
    }
    
    </style>
    
    </head>
    
    <body>
    <div id="marqueecontainer" onMouseover="M1.Speed=0" onMouseout="M1.Speed=2">
    <div style="position: absolute; width: 98%;">
    
    <!--YOUR SCROLL CONTENT HERE-->
    
    <h4>Your scroller contents 1</h4>
    <h4>Your scroller contents 2</h4>
    <h4>Your scroller contents 3</h4>
    <h4>Your scroller contents 4</h4>
    <h4>Your scroller contents 5</h4>
    
    <!--YOUR SCROLL CONTENT HERE-->
    
    </div>
    </div>
    <div id="marqueecontainer2" onMouseover="M2.Speed=0" onMouseout="M2.Speed=2">
    <div style="position: absolute; width: 98%;">
    
    <!--YOUR SCROLL CONTENT HERE-->
    
    <h4>Your scroller contents 1</h4>
    <h4>Your scroller contents 2</h4>
    <h4>Your scroller contents 3</h4>
    <h4>Your scroller contents 4</h4>
    <h4>Your scroller contents 5</h4>
    
    <!--YOUR SCROLL CONTENT HERE-->
    
    </div>
    </div>
    <script type="text/javascript">
    /*<![CDATA[*/
    
    function Marquee(o){
     var p=document.getElementById(o.ID),oop=this;
     this.divs=[p.getElementsByTagName('DIV')[0]];
     this.h=this.divs[0].offsetHeight
     this.divs[0].style.top=-this.h+'px';
     for (var top=0,div,z0=0;z0<Math.ceil(p.offsetHeight/this.divs[0].offsetHeight);z0++){
      this.divs[z0+1]=this.divs[0].cloneNode(true);
      p.appendChild(this.divs[z0+1]);
      this.divs[z0+1].style.top=this.h*z0+'px';
     }
     this.Speed=o.Speed||1;
     o.DelayStart=o.DelayStart||10;
     setTimeout(function(){ oop.scroll(); },o.DelayStart);
    }
    
    Marquee.prototype={
    
     scroll:function(){
      if (this.Speed>0){
       for (var z0=0;z0<this.divs.length;z0++){
        if ((parseInt(this.divs[z0].style.top)<-this.h)){
         this.divs[z0].style.top=parseInt(this.divs[z0].style.top)+this.h*this.divs.length+'px';
        }
        this.divs[z0].style.top=parseInt(this.divs[z0].style.top)-this.Speed+'px';
       }
      }
      var oop=this;
      setTimeout(function(){ oop.scroll(); },50);
     }
    
    }
    
    
    var M1=new Marquee({
     ID:'marqueecontainer',
     Speed:2,
     DelayStart:2000
    });
    
    var M2=new Marquee({
     ID:'marqueecontainer2'
    });
    
    /*]]>*/
    </script></body>
    
    </html>
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •