jquery - 如何使用鼠标位置创建移动元素,例如 http ://fieroanimals. com/?

标签 jquery image html position mouse

我想创建一个内部有图像的 div 元素,并用鼠标位置的坐标改变它的位置。有一些用于创建 3d 效果的 jquery-pluings,但我只需要在 X 和 Y 坐标上移动。此外,在 div 元素的限制内执行此操作。

我得到了下一个代码:

$('div.images').mousemove(function(e){
        var x = e.pageX - this.offsetLeft;
        var y = e.pageY - this.offsetTop;
        $('div.images').css({'top': x,'left': y}); 
    });

在 CSS 中,div.images 具有绝对位置。当我移动我的鼠标时,我的位置没有改变,但是当我在 CSS 中删除位置时,它应用了对元素样式的更改,但没有改变位置。

给我一​​些建议,我需要做什么。

http://fieroanimals.com/这是在 Flash 上实现的,但我想在 JQuery 上实现。

最佳答案

$(document).ready(function(){
      $('div.moveAble-container').mousemove(function(e){
            var y = e.pageY;
            var x = e.pageX;                    
            $('div.moveAble').css({'top': y}); 
            $('div.moveAble').css({'left': x});

      });
    });

关于jquery - 如何使用鼠标位置创建移动元素,例如 http ://fieroanimals. com/?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11244309/

相关文章:

javascript - 当页面从底部向前向后随机单击时,jquery 数据表滚动到顶部

javascript - jquery多次运行时缓存元素一次

javascript - 图片默认400px高度,点击放大,再次点击缩小

javascript - 将图像从 XML 显示为 HTML

javascript - 初始化后可以更改 OpenSeaDragon 平移选项吗

html - 如何同步循环遍历 indexedDB 表?

javascript - 当我的模式已经打开时阻止 "show"事件(脚本重新加载)

javascript - 使用 JQuery 选择具有特定类的所有 <tr> 元素

javascript - 深度路由未按预期工作 ui-router

html - 具有多列布局和移动 div 框排序的 flexbox