Я пробовал это в течение последних двух дней и, похоже, не могу понять решение.
У меня есть предыдущая и следующая стрелки, работающие для навигации (вместе со стрелками). Но теперь, когда у меня есть временная шкала, я не могу "перейти на" слайды, используя div-id (правильно)?
Так, например, если бы я хотел перейти от раздела 1 к разделу 5, я хочу, чтобы иметь возможность щелкнуть по моей кнопке 5 раздела, и она переходит на этот слайд.
Вот мой рабочий пример. Временная шкала слайдера отображается на слайде 2+. Например, я работаю только в целевом разделе.
Это код, который я использую для перехода к слайду:
$('.slideshow-timeline a').click(function() {
var target_id = $(this).attr('href');
removeClasses();
$($(".tour-panel")[current]).addClass("fadeOutRight");
setTimeout(function() {
$(target_id).addClass("active-tour fadeInLeft");
}, 50);
setTimeout(function() {
$($(".tour-panel")[current]).removeClass("fadeOutRight");
}, 750);
current = target_id.split('-')[1] || 0;
});
Но по какой-то причине у меня возникают две специфические проблемы:
Проблема 1: я нажимаю, чтобы перейти к слайду, а затем используйте клавиши со стрелками, чтобы вернуться назад. Это заставляет меня отсканировать 2 слайда.
Проблема 2: я нажимаю, чтобы перейти к слайду, а затем используйте клавиши со стрелками, чтобы идти вперед. Это нарушает мой слайдер и показывает белый экран
Я считаю, что большинство зонда лежит внутри этой строки кода:
current = target_id.split('-')[1] || 0;
Но я не уверен на 100% и нуждаюсь в вашей помощи, я подготовил очень простой пример скрипта здесь.
Некоторые вещи, которые я пробовал, возились с переменными split()
, заменяя nextElement();
и previousElement();
, и я просто не могу найти решение, которое работает.
Вся помощь очень ценится!