发新贴  快速回复

滚动 急求

雾里看花
2014-09-19 11:54
我想做一个 鼠标点击那个喇叭图标 然后鼠标向上向下移动,后面的线条向上向下移动。喇叭图标始终保持不变。 求指导。
无为
需要用到鼠标滚轮事件相关的知识,视频的DOM中级部分的事件应用中有讲到。
2014-09-19 20:58  回复本帖
雾里看花
forum.php?mod=redirect&goto=findpost&pid=30290&ptid=9375
需要用到鼠标滚轮事件相关的知识,视频的DOM中级部分的事件应用中有讲到。 ...

好的。 自己写了一个 不过还有点小bug。
2014-09-22 15:42  回复本帖
 
创美易-miaov
forum.php?mod=redirect&goto=findpost&pid=30364&ptid=9375
好的。 自己写了一个 不过还有点小bug。

<!DOCTYPE html>
<html lang="zh-cn">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>鼠标拖动小方块</title>
        <style type="text/css">
            .lineDiv{position:absolute;height:5px;font-size:0;line-height:0;background:#999;width:500px;top:100px;left:50%;margin-left:-250px}
            .lineDiv .minDiv{position:absolute;top:-5px;left:0;width:15px;height:15px;background:#000;cursor:pointer}
        </style>
    </head>
    <body>
        <center><h3>用鼠标拖动小方块</h3></center>
        <div id="lineDiv" class="lineDiv">
            <div id="minDiv" class="minDiv"></div>
        </div>
        <script>
             var scrollbar = document.getElementById("minDiv");
             var diffX = 0, diffY = 0; 
             scrollbar.onmousedown = function(e){
            var ev = e || window.envent;
            diffX = ev.clientX - this.offsetLeft;
            diffY = ev.clientY - this.offsetTop;
            document.onmousemove = function(e){
             var ev = e || window.envent;  
             var l =  ev.clientX - diffX;
             var t = ev.clientY - diffY;
             if( l<50 ){
                 l = 0;
             }else if( l > scrollbar.parentNode.clientWidth - scrollbar.clientWidth - 50 ){
                 l = scrollbar.parentNode.clientWidth - scrollbar.clientWidth;
             }
             if( t!==-5 ){
                 t = -5;
             }
             scrollbar.style.left = l +'px';
             scrollbar.style.top = t +'px';
             
            } 
            document.onmouseup = function(){
            document.onmousemove =   document.onmouseup = null;   
                
            }
            return false;
              
             }
        </script>    
    </body>
</html>

2014-09-22 16:31  回复本帖
雾里看花
forum.php?mod=redirect&goto=findpost&pid=30365&ptid=9375


谢谢。。。。。。
2014-09-26 17:54  回复本帖
 
创美易-miaov
forum.php?mod=redirect&goto=findpost&pid=30499&ptid=9375
谢谢。。。。。。

哈哈哈~~不用谢啦~~
2014-09-26 18:12  回复本帖
雾里看花
forum.php?mod=redirect&goto=findpost&pid=30500&ptid=9375
哈哈哈~~不用谢啦~~

深圳的小伙伴啊。 你在哪个区啊?{:soso_e113:}
2014-09-28 11:00  回复本帖
 
创美易-miaov
forum.php?mod=redirect&goto=findpost&pid=30537&ptid=9375
深圳的小伙伴啊。 你在哪个区啊?

ni ne.....
2014-09-28 14:33  回复本帖
雾里看花
forum.php?mod=redirect&goto=findpost&pid=30543&ptid=9375
ni ne.....

南山 tx这边。
2014-09-28 18:01  回复本帖
 
创美易-miaov
........................
2014-09-28 18:39  回复本帖
 
创美易-miaov
forum.php?mod=redirect&goto=findpost&pid=30555&ptid=9375
南山 tx这边。

这么巧~~我也是
2014-09-28 18:39  回复本帖
登录 后才可以发表回复