www.webdeveloper.com
Results 1 to 2 of 2

Thread: Pause Marquee Using Java Script

  1. #1
    Join Date
    Jul 2013
    Posts
    1

    Pause Marquee Using Java Script

    Hi people,

    I'm new to JS and but I really need to help with this:

    I have a scrolling marquee on my page.

    What I want to do is to be able to stop and start the scrolling of the marquee by the use of a button on the page.

    I know I can do this already be using onMouseOver effect like this:

    Code:
    <marquee onMouseOver="this.stop();" onMouseOut="this.start();" behavior="scroll" direction="up" scrollamount="2"><p>Some Text</p><p>Some Text</p><p>Some Text</p></marquee>
    However this is not really the effect I want.

    What I want the user to be able do is to stop and start the marquee by clicking on a button(s) on the web page.

    Please can some one help me out with this, I'm a newbe, so if you can help please bear with me and explain in a little detail.

    Much thanks.

  2. #2
    Join Date
    Jun 2004
    Location
    Portsmouth UK
    Posts
    2,670
    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>
    <script type="text/javascript">
    /*<![CDATA[*/
    function StopStart(b,id){
     var obj=document.getElementById(id);
     b.value=='Start'?obj.start():obj.stop();
     b.value=b.value=='Start'?'Stop':'Start';
    
    }
    /*]]>*/
    </script></head>
    
    <body>
    <marquee id="tst" onMouseOver="this.stop();" onMouseOut="this.start();" behavior="scroll" direction="up" scrollamount="2" style="width:100px;border:solid red 1px;" ><p>Some Text</p><p>Some Text</p><p>Some Text</p></marquee>
    
    <input type="button" name="" value="Stop" onmouseup="document.getElementById('tst').stop();"/>
    <input type="button" name="" value="Start" onmouseup="document.getElementById('tst').start();"/>
    <br />
    <br />
    <marquee id="tst1" behavior="scroll" direction="up" scrollamount="2" style="width:100px;border:solid red 1px;" ><p>Some Text</p><p>Some Text</p><p>Some Text</p></marquee>
    <input type="button" name="" value="Stop" onmouseup="StopStart(this,'tst1')"/>
    </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/

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles