Question

我刚刚为网站创建了一个滑块，其中一个寻呼机可以在触发鼠标悬停事件时更改幻灯片。我使用的是jQuery循环插件版本2.99

问题是在使用pagerEvent＆＃39; mouseover＆＃39;时，淡入淡出效果已经消失。

我不知道问题是什么，因为当我更改pagerEvent以点击淡入淡出效果时效果正常。

有人可以帮忙吗？

谢谢！

javascript代码：

function initSlideshow() {
$('#slides')
.before('<div id="nav">')
.cycle({
    timeout: 0,
    speed:   1500,
    pager: '#nav',
    pagerEvent:   'mouseover', // name of event which drives the pager navigation
    pauseOnPagerHover: true
});
}

HTML：

<div id="slider_wrapper">        
    <div id="nav">
        <a id="slide_1" href="#" class="">Dakkapellen</a>
        <a id="slide_2" href="#" class="">Dakkapellen</a>
        <a id="slide_3" href="#" class="">Dakkapellen</a>
        <a id="slide_4" href="#" class="">Dakkapellen</a>
    </div>
    <div id="slides">
            <div class="slide">
                <div class="image"><img src="images/sfeer/sfeer_01.jpg" alt="" /></div>
                <div class="title">Dakkapel al vanaf</div>
                <a href="#" title=""></a>
            </div>
            <div class="slide">
                <div class="image"><img src="images/sfeer/sfeer_02.jpg" alt="" /></div>
                <div class="title">Dakvenster vanaf</div>
                <a href="#" title=""></a>
            </div>
            <div class="slide">
                <div class="image"><img src="images/sfeer/sfeer_03.jpg" alt="" /></div>
                <div class="title">Nieuwe zolder in &eacute;&eacute;n week</div>
                <a href="#" title=""></a>
            </div>
            <div class="slide">
                <div class="image"><img src="images/sfeer/sfeer_04.jpg" alt="" /></div>
                <div class="title">Rente fiscaal aftrekbaar!</div>
                <a href="#" title=""></a>
            </div>
        </div>
    </div>

希望这有帮助！

Answer 1

我使用您的代码at this fiddle重新创建了一个滑块。它适用于您发布的代码。我假设你遗漏了pagerAnchorBuilder参数的代码。我认为问题是你可能有一个事件监听器捕获鼠标悬停事件并可能通过返回false或其他东西来停止传播。问题看起来肯定是来自其他地方。

jQuery循环淡入效果鼠标悬停

1 个答案: