zoukankan      html  css  js  c++  java
  • 无限轮播

    <!doctype html>  
    <html lang="en">  
    <head>  
        <meta charset="UTF-8">  
        <title>Document</title>  
        <style>  
            *{  
                padding: 0;  
                margin: 0;  
            }  
            ul li{list-style-type: none}  
            #banner{  
                 800px;  
                height: 400px;  
                overflow: hidden;  
            }  
            #banner ul{  
                 3600px;  
                overflow: hidden;  
            }  
            #banner ul>li{  
                 800px;  
                height: 400px;  
                float: left;  
            }  
            img{  
                max- 100%;  
            }  
        </style>  
    </head>  
    <body>  
        <div id="banner">  
            <ul>  
                <li><img src="1.jpg" alt="" width="900px" height="400px"/></li>  
                <li><img src="2.jpg" alt="" width="900px" height="400px"/></li>  
                <li><img src="3.jpg" alt="" width="900px" height="400px"/></li>  
                <li><img src="4.jpg" alt="" width="900px" height="400px"/></li>  
            </ul>  
        </div>  
        <input type="button" value="left" class="left"/>  
        <input type="button" value="right" class="right"/>  
      	<input type="text" id="clock" size="35" />
      
        <script src="jquery.js"></script>  
        <script>
    		setTimeout("dong()",600);  
    		setInterval("dong()",2400);
    		function dong()
    		{
    				$("#banner ul").animate({marginLeft:"-800px"},600, function () {  
    				$("#banner ul>li").eq(0).appendTo($("#banner ul"));  
    				$("#banner ul").css('marginLeft','0px');  
    			});  
    		}
        </script>  
    </body>  
    </html>
    

      

  • 相关阅读:
    Building Forest CodeForces
    欢迎使用CSDN-markdown编辑器
    Travelling HDU
    Card Collector HDU
    Doing Homework HDU
    Mirror Number SPOJ
    Palindromic Numbers LightOJ
    Magic Numbers CodeForces
    Xor-sequences CodeForces
    Little Elephant and Elections CodeForces
  • 原文地址:https://www.cnblogs.com/Kqingniao/p/6703824.html
Copyright © 2011-2022 走看看