Несколько синхронизированных каруселей совы ⇐ Jquery
Несколько синхронизированных каруселей совы
Я отредактировал приведенный здесь код, чтобы он обслуживал две карусели без зависимости от идентификатора, и это работает нормально, за исключением того, что я не могу заставить вкладки работать правильно при нажатии. (Например, удаление класса «synced» и правильное добавление его на выбранную вкладку.) Думаю, я делаю что-то неправильно как с функцией syncPosition, так и с функцией left.< /п> Где я упустил или сделал неправильно?
HTML:
1 2 3 4 5 Содержимое 1 Содержимое 2 Содержимое 3 Содержимое 4 Содержимое 5 1 2 3 4 Содержимое 1 Содержимое 2 Содержимое 3 Содержимое 4 Скрипт:
$(документ).ready(функция() { $('.tabslider').each(function(){ var sync1 = $(this).children(".tabcontent"); var sync2 = $(this).children(".tabthumb"); sync1.owlCarousel({ синглитем: правда, Скорость слайда: 1000, нумерация страниц: ложь, afterAction: syncPosition, отзывчивыйRefreshRate: 200, }); sync2.owlCarousel({ предметы: 3, предметыРабочий стол: [1199,3], itemsDesktopSmall : [979,3], предметыТаблица : [768,2], предметыМобильный: [479,2], нумерация страниц: ложь, навигация: ложь, навигацияТекст: [ "", "" ], отзывчивыйRefreshRate: 100, afterInit : функция(эль){ el.find(".owl-item").eq(0).addClass("синхронизировано"); } }); функция syncPosition(el){ вар текущий = this.currentItem; // $(".tabthumb") $(this).find(".tabthumb") .find(".элемент-сова") .removeClass("синхронизировано") .eq(текущий) .addClass("синхронизировано") if($(this).children(".tabthumb").data("owlCarousel") !== не определено){ левый (текущий) console.log(это) } } $(this).children(".tabthumb").on("click", ".owl-item", function(e){ е.preventDefault(); var номер = $(this).data("owlItem"); sync1.trigger("owl.goTo",number); }); функция влево(число){ var sync2visible = sync2.data("owlCarousel").owl.visibleItems; вар номер = номер; вар найден = ложь; for(var я в sync2visible){ если (число === sync2visible){ вар найден = правда; } } если (найден === ложь) { if(num>sync2visible[sync2visible.length-1]){ sync2.trigger("owl.goTo", num - sync2visible.length+2) }еще{ если (число - 1 === -1) { число = 0; } sync2.trigger("owl.goTo", num); } } else if(num === sync2visible[sync2visible.length-1]){ sync2.trigger("owl.goTo", sync2visible[1]) } иначе if(num === sync2visible[0]){ sync2.trigger("owl.goTo", число-1) } } }) });
Я отредактировал приведенный здесь код, чтобы он обслуживал две карусели без зависимости от идентификатора, и это работает нормально, за исключением того, что я не могу заставить вкладки работать правильно при нажатии. (Например, удаление класса «synced» и правильное добавление его на выбранную вкладку.) Думаю, я делаю что-то неправильно как с функцией syncPosition, так и с функцией left.< /п> Где я упустил или сделал неправильно?
HTML:
1 2 3 4 5 Содержимое 1 Содержимое 2 Содержимое 3 Содержимое 4 Содержимое 5 1 2 3 4 Содержимое 1 Содержимое 2 Содержимое 3 Содержимое 4 Скрипт:
$(документ).ready(функция() { $('.tabslider').each(function(){ var sync1 = $(this).children(".tabcontent"); var sync2 = $(this).children(".tabthumb"); sync1.owlCarousel({ синглитем: правда, Скорость слайда: 1000, нумерация страниц: ложь, afterAction: syncPosition, отзывчивыйRefreshRate: 200, }); sync2.owlCarousel({ предметы: 3, предметыРабочий стол: [1199,3], itemsDesktopSmall : [979,3], предметыТаблица : [768,2], предметыМобильный: [479,2], нумерация страниц: ложь, навигация: ложь, навигацияТекст: [ "", "" ], отзывчивыйRefreshRate: 100, afterInit : функция(эль){ el.find(".owl-item").eq(0).addClass("синхронизировано"); } }); функция syncPosition(el){ вар текущий = this.currentItem; // $(".tabthumb") $(this).find(".tabthumb") .find(".элемент-сова") .removeClass("синхронизировано") .eq(текущий) .addClass("синхронизировано") if($(this).children(".tabthumb").data("owlCarousel") !== не определено){ левый (текущий) console.log(это) } } $(this).children(".tabthumb").on("click", ".owl-item", function(e){ е.preventDefault(); var номер = $(this).data("owlItem"); sync1.trigger("owl.goTo",number); }); функция влево(число){ var sync2visible = sync2.data("owlCarousel").owl.visibleItems; вар номер = номер; вар найден = ложь; for(var я в sync2visible){ если (число === sync2visible){ вар найден = правда; } } если (найден === ложь) { if(num>sync2visible[sync2visible.length-1]){ sync2.trigger("owl.goTo", num - sync2visible.length+2) }еще{ если (число - 1 === -1) { число = 0; } sync2.trigger("owl.goTo", num); } } else if(num === sync2visible[sync2visible.length-1]){ sync2.trigger("owl.goTo", sync2visible[1]) } иначе if(num === sync2visible[0]){ sync2.trigger("owl.goTo", число-1) } } }) });
-
- Похожие темы
- Ответы
- Просмотры
- Последнее сообщение
-
-
Преобразование синхронизированных событий во временные ряды с наблюдениями Python
Anonymous » » в форуме Python - 0 Ответы
- 15 Просмотры
-
Последнее сообщение Anonymous
-