2014-09-10 2 views
4

Я использую Flexslider некоторое время и люблю его, но у меня есть пользовательская функция, которую я пытаюсь достичь, я немного застрял на.Flexslider: переход на следующий слайд (с задержкой) на пользовательской кнопке нажмите

В каждом слайде у меня есть текст с 2 кнопками, по существу истинными или ложными. После нажатия одной из кнопок, которые они оживляют, зависит от того, выбрал ли пользователь правильный ответ. Независимо от того, что они выбирают, хотя, после небольшой задержки в несколько секунд, я хочу, чтобы слайд-шоу приближалось к следующему слайду.

Мой FlexSlider вызов выглядит следующим образом:

$(window).load(function() { 
$('.flexslider').flexslider({ 
    animation: "slide", 
    animationLoop: false, 
    slideshow: false, 
    controlNav: false, 
    touch: true, 
    smoothHeight: true 
}); 
}); 

Я сумел создать немного JavaScript, так что при нажатии кнопки перемещается на 2-й слайд:

$('.true-or-false .btn').click(function() { 
$('.slider').flexslider(0); 
}); 

Но было бы больно делать это для каждой отдельной кнопки, я пытался найти «следующую» функцию, но не мог заставить работать. В дополнение к этому я попытался добавить .delay(2000), но это, похоже, не сыграло хорошо с вышеуказанным кодом.

Я думал, что будет функция задержки для слайдов в flexslider, и мне нужно будет только найти способ перехода к следующему слайду с помощью настраиваемой кнопки. Может ли кто-нибудь пролить свет на это?

Спасибо, что нашли время, чтобы прочитать это! Ste

* EDIT *

По какой-то причине, когда я впервые попробовал этот код он не работает, но теперь при добавлении «рядом» делает слайд одушевленные к следующему по нажатию кнопки - теперь мне просто нужна задержка!

$('.true-or-false .btn').click(function() { 
$('.slider').flexslider('next'); 
}); 

ответ

7

Похоже, что мне удалось получить эту работу и думал, что это может быть полезно, чтобы опубликовать мое решение здесь упаковывают каждый должен искать для достижения аналогичной функциональности с FlexSlider. Вот что я придумал:

$('.true-or-false .btn').click(function() { 
setTimeout(
    function() 
    { 
     $('.flexslider').flexslider('next') 
    } 
    , 2000); 
}); 

, который при нажатии на кнопку (на заказ) в FlexSlider будет перейти к следующему слайду, но не до задержки, когда вы можете указать.

И просто краткое примечание. Причина, по которой я хотел добиться этого эффекта, заключалась в том, что, когда вы нажимаете кнопку (либо true, либо false), анимация произошла, говоря пользователю, были ли они правильными или нет, прежде чем перейти к следующему вопросу.

Надеюсь, это поможет кому-то еще :)

 Смежные вопросы

  • Нет связанных вопросов^_^