Внешнее управление (Next / Prev) для Nivo Slider (Raphaeljs)?

Question

Я пытаюсь сделать слайд-шоу со следующими / предыдущими кнопками.Я использую NivoSlider для классных переходов и RaphaelJS для анимированных кнопок «следующий / предыдущий».Моя единственная проблема в том, что не существует встроенного способа дать элемент Nivoslider, который представляет следующую кнопку.Поскольку мой элемент представляет собой треугольник, который анимирует меня, мне нужно каким-то образом сообщить NivoSlider, что я хочу, чтобы $ (triangle.node) представлял следующий и предыдущий.Библиотека является частной (я думаю, что именно так вы это выражаете), поэтому она не может видеть глобальный triangle.node.Есть идеи?

Answer 1

Добавьте этот код перед тем, как инициализировать Nivo Slider, и замените параметры своим triangleNodePrev / Next.Преимуществом этого является отключение действия по умолчанию для ваших ссылок, чтобы при использовании href = "#" браузер не прокручивал назад до верхней части страницы.

$('#previousButton, #nextButton').on('click', function (e) {

         // Prevent the link from being followed
         e.preventDefault();

         // Initialize variables 
         var buttonId = this.id,
          buttonClass = ('previousButton' == buttonId) ? '.nivo-prevNav' : '.nivo-nextNav';

         // Trigger the slider button
         $('.nivo-directionNav').find(buttonClass).click();
    });

Answer 2

$("#triangleNodePrev").click(function(){$(".nivo-directionNav .nivo-prevNav").click()})
$("#triangleNodeNext").click(function(){$(".nivo-directionNav .nivo-nextNav").click()})

Что должно сделать это, но в любом случае вам нужны следующие команды:

$(".nivo-directionNav .nivo-prevNav").click()

и

$(".nivo-directionNav .nivo-nextNav").click()

Answer 3

<script type='text/javascript'>
$(document).ready(function() {
    jQuery("#previousButton').click(function (e) {
         e.preventDefault();
         jQuery(".nivo-directionNav .nivo-prevNav").click();
    });
    jQuery("#nextButton').click(function (e) {
         e.preventDefault();
         jQuery(".nivo-directionNav .nivo-nextNav").click();
    });
});
</script>