0

我正在尝试使用 jquery 但在另一个元素上模拟悬停。

基本上我在下面有我的幻灯片......

<div id="slideshow">

...

</div>

我有这些设置...

var slider = $('#slideshow').bxSlider({
    autoHover: true 
})

这些设置只是让幻灯片在<div id="slideshow">悬停时暂停。幻灯片放映在您推出时开始播放。


我的问题是,是否有模拟悬停动作<div id="slideshow">,而是当下面的这个元素悬停在/悬停时?

<div id="slideshow-custom-nav">

... // When this element is hovered in/out, I need it to pause/continue the slideshow. So by simulating a hover on the #slideshow div, this should work hopefully.

</div>


任何建议都是最棒的!谢谢

4

1 回答 1

0

理论上,是的。您必须使用 jQuery 的.trigger()方法手动触发悬停事件。

我自己没有使用过 bxSlider,但我相信您必须查找插件是否触发了自定义事件,以便您可以在调用时指定该事件.trigger()

更新

好的,在快速浏览了 GitHub 上的 bxSlider 代码后,我发现它在整个插件代码中使用了正常的事件。正如您在第 770 行看到的那样,插件正在为元素定义处理程序mouseenter和事件(在第 90 行定义)。mouseleaveel

因此,作为有根据的猜测,您可能会尝试在您认为合适的地方自己触发这些事件。就像是:

$('#slideshow-custom-nav').on('mouseenter', function(){
    $('#slideshow').trigger('mouseenter');
}).on('mouseleave', function(){
    $('#slideshow').trigger('mouseleave');
});
于 2012-12-13T15:20:23.087 回答