Слайдер и display:none

[Noonf]

Добавил, только поменял местами строчки т.к. .bg_slider (затемнение) срабатывал только при повторном нажатии

jQuery('.product_1').click(function(){
jQuery('.bg_slider').addClass('active');
jQuery('.product_slider_1').addClass('active').sli ck('reInit') ;
});

Проблема стала проявляться реже, примерно 1 раз из 5

[рони]

Noonf,
у вас все слайдеры открываются одновременно?

[Noonf]

нет, открывается только один

[Noonf]

Вот так прописано для всех пяти слайдеров

jQuery('.product_1').click(function(){
jQuery('.bg_slider').addClass('active');
jQuery('.product_slider_1').addClass('active').sli ck('reInit') ;
});

jQuery('.bg_slider').click(function(){
jQuery('.product_slider_1').removeClass('active');
jQuery('.bg_slider').removeClass('active');
});



jQuery('.product_2').click(function(){
jQuery('.bg_slider').addClass('active');
jQuery('.product_slider_2').addClass('active').sli ck('reInit') ;
});

jQuery('.bg_slider').click(function(){
jQuery('.product_slider_2').removeClass('active');
jQuery('.bg_slider').removeClass('active');
});



jQuery('.product_3').click(function(){
jQuery('.bg_slider').addClass('active');
jQuery('.product_slider_3').addClass('active').sli ck('reInit') ;
});

jQuery('.bg_slider').click(function(){
jQuery('.product_slider_3').removeClass('active');
jQuery('.bg_slider').removeClass('active');
});



jQuery('.product_4').click(function(){
jQuery('.bg_slider').addClass('active');
jQuery('.product_slider_4').addClass('active').sli ck('reInit') ;
});

jQuery('.bg_slider').click(function(){
jQuery('.product_slider_4').removeClass('active');
jQuery('.bg_slider').removeClass('active');
});



jQuery('.product_5').click(function(){
jQuery('.bg_slider').addClass('active');
jQuery('.product_slider_5').addClass('active').sli ck('reInit') ;
});

jQuery('.bg_slider').click(function(){
jQuery('.product_slider_5').removeClass('active');
jQuery('.bg_slider').removeClass('active');
});

[Noonf]

А этот код общий для всех

jQuery(window).on("load", function() {
jQuery('.product_slider')
.addClass('active')
.slick({
autoplay: true,
autoplaySpeed: 500,
speed: 1000,
slidesToShow: 4
})
.removeClass('active');
});

[рони]

Noonf,
много кода ... много лишнего кода ...

[Noonf]

Понял, закрытие слайдера сократил вот так

jQuery('.bg_slider').click(function(){
jQuery('.product_slider').removeClass('active');
jQuery('.bg_slider').removeClass('active');
});

[рони]

Noonf,
форум - поиск - открывашка

[Noonf]

Прописал открытие вот так, правда пока только для одного ) Но проблема осталась


window.addEventListener("DOMContentLoaded", function() {
var btn = document.querySelectorAll("[data-id]"),
block = document.querySelectorAll(".product_slider_1");
[].forEach.call(btn, function(item, k) {
item.dataset.text = item.textContent;
var id = item.dataset.id;
item.addEventListener("click", function(event) {
event.preventDefault();
[].forEach.call(block, function(el, i) {
if (el.id == id) {
el.classList.product_slider("active");
el.classList.contains("active") && block[0].classList.remove("active")
}
else el.classList.add("active");
});
})
})
});

[рони]

Noonf,
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:

[js]
... ваш код...
[/js]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.