Конфликт fancybox и bxSlider

[fenix_63]

сейчас буду пробовать...

[fenix_63]

рони

вариант:

window.setTimeout(function() {
    $(".bxslider").each(function(indx, element) {
                    var slider = $(element).bxSlider({
                        pagerCustom: "#bx-pager"
                    });
                    $(".trigger").eq(indx).fancybox({
                        onComplete: function(a) {
                            slider.reloadSlider()
                        }
                    })
                });
}, 3000)

действительно оказался рабочим !!!
спасибо вам огромное!!!


т.е. в итоге вот так всё это выглядит:

...
<script>
            window.setTimeout(function() {
                $(".bxslider").each(function(indx, element) {
                                var slider = $(element).bxSlider({
                                    pagerCustom: "#bx-pager"
                                });
                                $(".trigger").eq(indx).fancybox({
                                    onComplete: function(a) {
                                        slider.reloadSlider()
                                    }
                                })
                            });
            }, 3000)

</script>

<script>
            
$(document).ready(function(){
        //Нужно для раскрытия вкладки "Я хочу купить триколор"
        $('.buy').on('click', function(){
                    $('.cards').fadeIn();
                });
        });
</script>

......

<script>

    $.get('modal_form.html', function(data){

        $(data).insertBefore('.wrapper .load');
        
    });

    $.get('modals/modal_form2.html', function(data){

        $(data).insertBefore('.wrapper .load');
        
    });

    $.get('modals/modal_form_3.html', function(data){

        $(data).insertBefore('.wrapper .load');
        
    });

    $.get('modals/modal_form_4.html', function(data){
        $(data).insertBefore('.wrapper .load');
        
    });

    $.get('modals/modal_form_5.html', function(data){
        $(data).insertBefore('.wrapper .load');
        
    });

    $.get('modals/modal_form_6.html', function(data){
        $(data).insertBefore('.wrapper .load');
        
    });

    $.get('modals/modal_form_7.html', function(data){
        $(data).insertBefore('.wrapper .load');
        
    });

    $.get('modals/modal_form_8.html', function(data){
        $(data).insertBefore('.wrapper .load');
        
    });
</script>

выложил на хостинг http://trikolor-orenburg.ru/
Работает именно так, как надо, рони спасибо большое !!!

[рони]

fenix_63,

pagerCustom: $('[id="bx-pager"]').eq(indx)

но лучше класс, id уникально
и тогда

pagerCustom: $('.bx-pager').eq(indx)

[fenix_63]

понял, буду иметь ввиду, спасибо

[рони]

fenix_63,
замена таймера

var count = 8;
 function init()
      {
//иницализация слайдеров
      }
$.get('modal_form.html', function(data){
         $(data).insertBefore('.wrapper .load');
count--;
if(!count) init()
     });

[fenix_63]

Заметил ещё вот такой баг:

Когда жмём по ссылке "подробнее" у карточки товара, появляется модальное окно - тут всё нормально отображается, но слайдер почему то не рабочий: отображается большая картинка товара, и 3 маленьких сниху, но если по какой-либо из трёх маленьких кликнуть - то слайдер не "перелистывает" большую картинку, и почему то полностью закрывается всё модальное окно, и у других карточек товаров ссылка "подробнее" становится недоступной - по ней не кликнуть, блок с id="modal1" как был display:block, так в этом же состоянии и остался, и как бы закрывает собой остальные элементы страницы.

Кто знает, подскажите пожалуйста, как это лечится?

http://trikolor-orenburg.ru/ вот тут всё это лежит.

[fenix_63]

Появился ещё вот такой вопрос: хочу сделать изображения товаров кликабельными - т.е. чтобы когда пользователь кликает по изображения товара - чтоб появлялось модальное окно с подробными характеристиками этого товара. Точно такой же функционал, как если бы пользователь нажал на ссылку "Подробнее".

Проблема вот в чём сейчас: я сделал такой функционал у 1-й карточки товара, и если кликнуть по картинке, то модальное окно с подробным описанием товара нормально открывается, и слайдер внутри нормально работает и "перелистывается". Но только ссылка "Подробнее" у этой карточки товара теперь открывает окно с неработающим слайдером - слайдер не загружает большое изображение товара, и не работает "перелистывание" изображений этого товара в модальном окне.

Помогите народ пожалуйста, кто знает. Вот сам сайт: http://trikolor-orenburg.ru/