鼠标在图片上移动，图片实现微动的效果

最新推荐文章于 2022-12-16 20:40:00 发布

原创最新推荐文章于 2022-12-16 20:40:00 发布 · 1.7k 阅读

0 ·

CC 4.0 BY-SA版权

前端开发专栏收录该内容

4 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现的鼠标悬停时元素产生3D旋转效果的方法。通过监听鼠标移动事件并计算出相对于窗口中心的位置来动态调整元素的旋转角度，实现了流畅且吸引人的视觉效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

wrapNode.find('.banner').on("mousemove",function(e) {    
      
        var ax = -($(window).width()/2- e.pageX)/100;
        var ay = ($(window).height()/2- e.pageY)/50;
        $(this).find('.scene').attr("style", "transform: rotateY("+ax+"deg) rotateX("+ay+"deg);");
     });
}