Javascript 动画视频滚动条

我有一个带有烤饼图标的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滑块手柄的动画（就像在视频电影中一样，这样他就可以在上面滚动）。用用户的鼠标或键盘上的右键移动光标应该与div的宽度和电影大小有关

我该怎么做？
我想您应该将div相对于鼠标移动到，好的，您应该根据鼠标坐标设置div的左侧和顶部

jQuery(document).ready(function(){

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

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

   }); 

})