Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Конфликт fancybox и bxSlider (https://javascript.ru/forum/misc/70492-konflikt-fancybox-i-bxslider.html)

fenix_63 09.09.2017 21:15

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

fenix_63 09.09.2017 21:31

рони

вариант:

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/
Работает именно так, как надо, рони спасибо большое !!!

рони 09.09.2017 21:37

fenix_63,
pagerCustom: $('[id="bx-pager"]').eq(indx)
но лучше класс, id уникально
и тогда
pagerCustom: $('.bx-pager').eq(indx)

fenix_63 09.09.2017 21:44

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

рони 09.09.2017 21:55

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

fenix_63 23.09.2017 16:08

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

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

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

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

fenix_63 05.11.2017 16:24

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

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

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


Часовой пояс GMT +3, время: 23:55.