javascript——运动侧边分享

来源:互联网 发布:windows正版软件多少钱 编辑:程序博客网 时间:2024/06/06 13:01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><html xmlns="http://www.w3.org/1999/xhtml">    <head>        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />        <title>侧边栏</title>        <style type="text/css">#div1 {width: 100px;height: 200px;position: absolute;left:-100px;top: 200px;background: #ccff00;}#div1 span {top: 70px;left: 100px;width: 20px;height: 75px;background: url(l.gif);text-align: center;vertical-align: middle;line-height: 20px;font-size: 12px;display: block;position: absolute;}        </style>    </head>    <script type="text/javascript">        window.onload = function() {            var oDiv1 = document.getElementById("div1");            var oSpan1 = document.getElementById("span1");            oDiv1.onmousemove=function(){                startMoveDiv(oDiv1,0);            };            oDiv1.onmouseout=function(){                startMoveDiv(oDiv1,-100);            };                       var oTimer=null;            function startMoveDiv(obj,iTarget){                clearInterval(oTimer);//停止定时器                oTimer=setInterval(function(){                    var speed=0;                    if (obj.offsetLeft<iTarget) {//判断速度,区别向左还是向右运动                        speed=10;                    }else{                        speed=-10;                    };                    if (obj.offsetLeft==iTarget) {                        clearInterval(oTimer);                    } else{                        obj.style.left=obj.offsetLeft+speed+"px";//运动                    };                },30);                            }                   };    </script>    <body>        <!-- JiaThis Button BEGIN -->        <script type="text/javascript" src="http://v3.jiathis.com/code_mini/jiathis_r.js?move=0&btn=r4.gif" charset="utf-8"></script>        <!-- JiaThis Button END -->        <div id="div1">            <span id="span1"> </span>        </div>    </body></html>

0 0
原创粉丝点击