zoukankan      html  css  js  c++  java
  • js实现固定滑动效果

    <!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">
    <head>
    <style type="text/css">
    *{margin:0px auto; padding:0px;}
    #wai{width:1000px; height:500px; margin-top:50px;}
    #zuobian{ height:500px; background-color:#C66; float:left}
    #youbian{ height:500px; background-color:#F99; float:left;}
    #anniu{width:50px; height:50px; background-color:#3F3; position:relative; margin-left:0px; top:225px; }
    
    </style>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head>
    
    <body>
    <div id="wai">
    <div id="zuobian" style="200px;"></div>
    <div id="youbian" style="800px;"></div>
    <div id="anniu" style="left:175px;"></div>
    </div>
    </body>
    <script type="text/javascript">
    var anniu = document.getElementById("anniu");
    var ids;
    anniu.onclick=function(){
        ids = window.setInterval("yidong()",5);
        }
        function yidong(){
            var zuobian = document.getElementById("zuobian");
            var youbian = document.getElementById( "youbian");
            var anniu = document.getElementById( "anniu");
            var zb = parseInt (zuobian.style.width);
            var yb = parseInt (youbian.style.width);
            var an = parseInt (anniu.style.left);
            if(zb<800){
                zb++;
                yb--;
                an++;
                }else{
                    window.clearInterval(ids);
                    }
            
            zuobian.style.width = zb+"px";
            youbian.style.width = yb+"px";
            anniu.style.left = an+"px";
            }
    </script>
    </html>

  • 相关阅读:
    iOS获取系统时间
    iOS面试-assign与retain
    iOS-检测网络可连接性
    iOS-ASI异步下载图片
    iOS-NSString值为Unicode格式(字符串编码转换成中文编码)
    iOS-模态视图动画
    iOS-UIScrollView滚动视图(转)
    iOS-NSFileManager
    iOS-self.用法
    iOS-iphone网络编程总结
  • 原文地址:https://www.cnblogs.com/palpitate/p/8891135.html
Copyright © 2011-2022 走看看