zoukankan      html  css  js  c++  java
  • 侧边栏

    View Code
    <html>
    <head>
    <meta charset="utf-8">
    <title>无标题文档</title>
    <style type="text/css">
    *{margin:0;padding:0;}
    #div1{width:100px;height:300px;background:red;position:absolute;left:-100px;top:100px;}
    #div2{width:30px;height:50px;background:green;position:absolute;top:50%;right:-30px;margin-top:-25px;}
    </style>
    <script type="text/javascript">
    var time=null;
    
    var tii=null;
    window.onload=function()
    {
        var oDiv1=document.getElementById('div1');
        var oDiv2=document.getElementById('div2');
        
        oDiv1.onmousemove=function()//当鼠标移上去的时候
        {
            shou(0)
        };
        oDiv1.onmouseout=function()//当鼠标离开的时候
        {
            shou(-100)
        };
    };
    
    function shou(name)
    {
            var oDiv1=document.getElementById('div1');//获得div
            clearInterval(time);//关闭定时器
            
            var ip=0;//div移动的速度
            
            if(oDiv1.offsetLeft<=name)//当它小于零时,速度值为整数
            {
                ip=10;
            }
            else//当它大于等于零时速度值为负数
            {
                ip=-10;
            }
            
            time=setInterval(function()//开启定时器
            {
                if(oDiv1.offsetLeft==name)//当left值等于参数(0或-100)
                {
                    clearInterval(time);//关闭定时器
                }
                else//否则把速度值累加到div上
                {
                    oDiv1.style.left=oDiv1.offsetLeft+ip+'px';
                }
            },50)
    }
    </script>
    </head>
    
    <body style="height:2000px;">
    <div id="div3"></div>
    <div id="div1">
        <div id="div2"><br/></div>
    </div>
    </body>
    </html>

  • 相关阅读:
    zookeeper集群
    Hbase分布式集群
    smokeping Master/Slave安装配置
    CentOS修改163源(转载)
    linux 挂载(转载)
    linux挂载U盘(转载)
    linux下修改path变量(转载)
    tar.gz和rpm安装文件(转载)
    linux ps命令(转载)
    linux free命令(转载)
  • 原文地址:https://www.cnblogs.com/tltl/p/3064194.html
Copyright © 2011-2022 走看看