Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Проблема с fancybox() (https://javascript.ru/forum/misc/70674-problema-s-fancybox.html)

fenix_63 24.09.2017 14:44

Проблема с fancybox()
 
Всем привет!

У меня вот такая проблема:
Сайт: http://trikolor-orenburg.ru/

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

Народ, если кто с таким сталкивался, и знает, как это можно вылечить - подскажите пожалуйста.

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

Помогите пожалуйста, уже и не знаю что тут можно сделать.

j0hnik 24.09.2017 14:57

$('.fancybox-close-small').on('click', function(){
$('#modal1').hide();
});

fenix_63 24.09.2017 15:53

Пробовал я такой способ - не работает

void() 24.09.2017 22:40

Как-то так работает в консоли Хрома.
#modal1.style.display = 'none';

fenix_63 25.09.2017 12:54

Ну млжет кто знает почему из кода этот способ не работает?

vitek-82 25.09.2017 22:04

Есть предположение. До и после нажатия на "подробнее" блок с id="modal1" выглядит так:

<div id="modal1" uk-modal="" class="uk-modal">...</div>


При срабатывании "onclick" на:

<button data-fancybox-close="" class="fancybox-close-small"></button>


... крестик верхний левый угол, блок с ID "modal1" преобразуется в:

<div id="modal1" uk-modal="" class="uk-modal" style="display: block;">...</div>


для того чтобы все работало, "display" должен быть в "none". Потому ищите каким образом при срабатывании onclick на .fancybox-close-small в #modal1 ставится style="display: block;" и исправьте на style="display: none;"

fenix_63 05.11.2017 16:26

Спасибо.

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

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

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


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