jQuery鼠标移动图片上实现放大效果的示例分析
小编给大家分享一下jQuery鼠标移动图片上实现放大效果的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!
创新互联公司专业为企业提供禅城网站建设、禅城做网站、禅城网站设计、禅城网站制作等企业网站建设、网页设计与制作、禅城企业网站模板建站服务,十多年禅城做网站经验,不只是建网站,更提供有价值的思路和整体网络服务。
首先界面上要有图片,下面是图片
其次在script代码段中加入如下代码,进行适量修改即可 $(document).ready(function () { var x = 10; var y = 20; $("#big-circle").mouseover(function (e) { var tooTip = ""; $("body").append(tooTip); $("#tooTip").css({ position: "absolute", 'top': (e.pageY + y) + "px", "left": (e.pageX + x) + "px" }).show("fast"); }).mouseout(function () { $("#tooTip").remove(); }).mousemove(function (e) { $("#tooTip").css({ position: "absolute", 'top': (e.pageY + y) + "px", "left": (e.pageX + x) + "px" }); }); });以上是“jQuery鼠标移动图片上实现放大效果的示例分析”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联行业资讯频道!
分享标题:jQuery鼠标移动图片上实现放大效果的示例分析
标题链接:http://ybzwz.com/article/jeceji.html