2 u012363465 u012363465 于 2013.10.30 16:04 提问

用jquery写了个图片切换效果,想让鼠标悬停图片时候图片停止切换,没有悬停则自动切换

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



幻灯效果 var scrollDuration = 1000;//切换速度 var timeDuration = 2000;//等待时间 var scrollEasing = 'quadratic'; $(function() { $('#content').carouFredSel({ direction: 'down',//滑动方向 width: 480, height: 264, items: { visible: 1, width: 480, height: 264 }, scroll: { fx: 'directscroll', duration: scrollDuration, timeoutDuration: timeDuration, easing: scrollEasing, onBefore: function( data ) { data.items.old.animate({ 'margin-left': -140 }, scrollDuration, scrollEasing); data.items.visible.css({ 'margin-left': 264 }).animate({ 'margin-left': 10 }, scrollDuration, scrollEasing); } }//scroll end }) }) #box{ width:480px; height:264px; margin:-132px 0 0 -240px; position:absolute; top:50%; left:50%; overflow:hidden; } #content { position:absolute; width:480px; height:260px; bottom:0; left:0; } #content img { display:block; margin-right:10px; float:left; }


1个回答

xy1224657942
xy1224657942   2013.11.27 13:56
已采纳

你可以给图片添加一个mouseenter()和mouseleave()事件,enter进图片时用stop()停止一切动画(或者关闭定时器),leave图片时开启定时器,这样就可以实现鼠标悬停了。

Csdn user default icon
上传中...
上传图片
插入图片