javascript - 动画视频滚动条

Question

我有一个带有 scoller 图标的 div:

.ui-slider
{ 
    top: 0;
    height: 100%;
    left: 0;
    right: 0;
    width: 100% !important;
    float: none !important;
    margin: 0 auto !important;
    position: absolute;
    z-index: 1;
    display: block;
    position: relative;
    text-align: left;
 }

.ui-slider-handle
{
   position: absolute;
   z-index: 2;
   width: 16px;
   height: 16px;
   cursor: default;
 }

我在代码中这样使用它:

<div class="ui-slider">
 <a href="#" class="ui-slider-handle" style="left: 0px;" id="slid"/></div>

我想用用户的鼠标为 ui-slider-handle 设置动画(就像在视频电影中一样 - 这样他就可以在上面滚动)。用用户的鼠标或键盘中的右键移动光标应该与 div 的宽度和电影大小相关。

我该怎么做？

Answer 1

我想你想相对于鼠标移动你的 div，好的，你应该根据鼠标坐标设置 div 的左侧和顶部，有些人认为

jQuery(document).ready(function(){

   $(document).mousemove(function(e){

      $('.ui-slider').css({"top":e.pageY, "left":e.pageX});

   }); 

})