【jquery鼠标移入移出】jquery图片列表鼠标移入微动实现代码

时间:2020-12-09  来源:jquery  阅读:

本效果使用jQuery和CSS实现了图片列表,当鼠标移入时图片向左微动,移出则复原。

其中的jQuery事件使用mouseenter 和 mouseleave ,事件绑定方法使用新推荐的on方法。

代码如下:

    jQuery实现图片列表鼠标移入微动_何问起        

jQuery实现图片列表鼠标移入微动

春节对联 下雨天 磨砂玻璃 网页特效 何问起统计文件数 HovertreeImg 原文 首页 特效 <script type="text/javascript" src="http://down.hovertree.com/jquery/jquery-1.11.3.min.js"></script> <script type="text/javascript"> $(function () { $(\".hovertreecontainer .hover\"+\"tree-item-box\").on(\"mouseenter\", function (ev) { var oImgBox = $(this).find(\".hovertree-img-box\"); $(oImgBox).stop(true).animate({ right: \"20px\" }, "normal"); }).on(\"mouseleave\", function (ev) { var oImgBox = $(this).find(\".hovertree-img-box\"); $(oImgBox).stop(true).animate({ right: \"10px\" }, "normal"); }); }); </script>

以上就是jquery图片列表鼠标移入微动实现代码的全部内容,希望大家在看完之后会有所帮助。

【jquery鼠标移入移出】jquery图片列表鼠标移入微动实现代码

http://m.bbyears.com/wangyezhizuo/115440.html

推荐访问:
相关阅读 猜你喜欢
本类排行 本类最新