zoukankan      html  css  js  c++  java
  • 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>
  • 相关阅读:
    POJ 1007 DNA Sorting
    POJ 1005 I Think I Need a Houseboat
    POJ 1004 Financial Management
    POJ 1003 Hangover
    洛谷 P2064 奇妙的汽车
    01分数规划学习笔记
    线性基学习笔记
    codeforces 727F Polycarp's problems
    codeforces 722E Research Rover
    并查集学习笔记
  • 原文地址:https://www.cnblogs.com/visense/p/3216196.html
Copyright © 2011-2022 走看看