Jquery Cycle2 Link внутри пейджерной области не работает

Question

Jquery Cycle2 Link внутри пейджерной области не работает

0

У меня есть настройка, работающая с плагином cycle2, но ссылка внутри области пейджера не работает, если вы не щелкните ее правой кнопкой мыши и не откройте в новом окне. Предложения?

<div class="cycle-slideshow" data-cycle-fx=fade data-cycle-timeout=50000 data-cycle-pager="#no-template-pager" data-cycle-slides="div" data-cycle-pager-template="">
<div id="tab1"><h1>Test Slide One</h1></div>
<div id="tab2"><h1>Test Slide Two</h1></div>
<div id="tab3"><h1>Test Side Three</h1></div>
<div id="tab4"><h1>Test Slide Four</h1></div> 
</div>
<div id="no-template-pager">
<div class="tab1"><p>Lorem ipsum dolor sit amet.</p><p><a href="http://www.google.com">Test Link</a></p> </div>

<div class="tab2"><p>Lorem ipsum dolor sit amet.</p><p><a href="http://www.google.com">Test Link</a></p> </div>

<div class="tab3"><p>Lorem ipsum dolor sit amet.</p><p><a href="http://www.google.com">Test Link</a></p> </div>

<div class="tab4"><p>Lorem ipsum dolor sit amet.</p><p><a href="http://www.google.com">Test Link</a></p> </div>
</div>

См. Скрипку, заметив, что щелчок по ссылке в области пейджера ничего не делает, но если вы щелкнете ее правой кнопкой мыши, откроется ссылка.

user1172854 13 март 2014, в 19:03

Источник

Теги:

javascript

jquery

html

slideshow

jquery-cycle2

2 ответа

Ещё вопросы

YujiHayashi · Answer 1 · 2014-12-30T15-34-00.000Z

Вы можете использовать stopPropagation по ссылке, когда вы нажимаете, например:

jQuery(document).ready(function(){
    $('#no-template-pager a').click(function (event) {
        event.stopPropagation();
    });
});

user3661123 · Answer 2 · 2014-05-21T11-43-00.000Z

Я тоже использую цикл2 и имею ту же проблему, но было решено добавить data-cyle-pager-eventbubble = "true" или в моем случае pagerEventBubble: true. Он пузырится на событие, нажав на DOM, позволяя видеть и выполнять href.

Я использую jquery 1.9.1, а код:

$(document).ready(function(){
$('.banner-imagem').cycle({
    slides: "li",
    timeout: 0,
    fx: "fadeout",
    speed: 400,
    manualFx: "scrollHorz",
    manualSpeed: 400,
    pager: "#banner-nav",
    pagerTemplate: "#per-slide-template",
    loader: "wait",
    log: false,
    pagerActiveClass: "slide-ativo",
    slideActiveClass: "slide-ativo",
    slideClass: "slide-imagem",
    pagerEventBubble: true
});

});