Change the marquee directions on button click left and right

example 1:

<html>
 <body>
 <script language="JavaScript">
     function function1(){
         document.all.myMarquee.direction = "up";
     }
     function function2(){
         document.all.myMarquee.direction = "left";
     }
     function function3(){
         document.all.myMarquee.direction = "right";
     }
     function function4(){
         document.all.myMarquee.direction = "down";
     }
 </script>
 <marquee id="myMarquee" bgcolor="cyan">MARQUEE TEXT HERE</marquee>
 <button onclick="function1();">Up</button>
 <button onclick="function2();">Left</button>
 <button onclick="function3();">Right</button>
 <button onclick="function4();">Down</button>
 </body>

example 2

<head>
  <script type="text/javascript">
    function changeMarquee(dir) {
    

    //sets the direction atribute for the marquee tag
      document.getElementById('myMarquee').setAttribute('direction', dir);
    

    //changes the direction after 2 seconds (2000 = 2 seconds)
      if (dir == 'left') {
        setTimeout("document.getElementById('myMarquee').setAttribute('direction', 'right')", 2000);
      }
      else {
        setTimeout("document.getElementById('myMarquee').setAttribute('direction', 'left')", 2000);
      }
    }
  </script>
</head>
<body>
  <div>
    <marquee id="myMarquee" direction="right">This is some text</marquee>
  </div>
  <input type="button" onclick="changeMarquee('left')" id="leftBtn" value="Marquee Left" />
  <input type="button" onclick="changeMarquee('right')" id="righBbtn" value="Marquee Right" />
</body>

example3

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>.::M A R U Q U E E::. </title>
</head>
<body>
<script language="JavaScript">
    function goRightfor2sec()
    {
        document.getElementById('myMarquee').direction = "right";
    }
    function crawlLeft(){
        setTimeout(goRightfor2sec,2000);
        document.getElementById('myMarquee').direction = "left";
    }
    function crawlRight(){
        setTimeout(goLeftfor2sec,2000);
        document.getElementById('myMarquee').direction = "right";
    }
    function goLeftfor2sec(){
        document.getElementById('myMarquee').direction = "left";
    }
</script>
<button onclick="crawlLeft();">Left</button>
<marquee id="myMarquee"  bgcolor="cyan">MARQUEE TEXT HERE</marquee>
<button onclick="crawlRight();">Right</button>
</body>
</html>

 

posted @ 2013-07-26 00:12  visense  阅读(406)  评论(0)  编辑  收藏  举报