Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 23.06.2016, 12:24
Новичок на форуме
Отправить личное сообщение для mn8156 Посмотреть профиль Найти все сообщения от mn8156
 
Регистрация: 23.06.2016
Сообщений: 7

Модальное окно (Работает на компьютере и в Windows Phone, но не на Android.iOS)
Здравствуйте! Столкнулся со странной ситуацией: скрипт правильно работает на компе и на Windows Phone (!), а на Androi, iOS не правильно.

Как должно быть: модальное окно, которое появляется при клике на заголовок. Закрывается если кликаем куда угодно в окне, кроме заголовка от которого он выпал и клика на само окно. И при изменении размера окна браузера.

Проблема: на Android и iOS окно пропадает после прокрутки экрана(но не всегда). Работает не предсказуемо.

Вот код:

jQuery(document).ready(function () {

    $(".category-header__title").on("click", function(){
        //Появляется при клике
        var offset = $(this).offset();
        var offsetArrow = $(this).find(".h2-arrow-bottom").offset();


        $(".rubrik__drop-list").css({"display":"block",
                                    "top": offset.top+40,
                                    "left": offset.left });
    })


    $("body").on("click", function (e) {       

        //Закрытие при клике куда угодно , кроме заголовка и самого окна
        if (  ($(e.target).closest(".category-header").hasClass("category-header") == false) &&
              ($(e.target).closest(".rubrik__drop-list").hasClass("rubrik__drop-list") == false)
                     ) {
            $(".rubrik__drop-list").css({"display":"none"});
        }

    })

    //Закрытие при изменении размера окна браузера
    $(window).on("resize", function(){
        $(".rubrik__drop-list").css({"display":"none"});
    })

});

Последний раз редактировалось mn8156, 27.06.2016 в 17:47.
Ответить с цитированием
  #2 (permalink)  
Старый 23.06.2016, 22:01
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

mn8156, попробуй "body" на document заменить.
Ответить с цитированием
  #3 (permalink)  
Старый 27.06.2016, 18:09
Новичок на форуме
Отправить личное сообщение для mn8156 Посмотреть профиль Найти все сообщения от mn8156
 
Регистрация: 23.06.2016
Сообщений: 7

Ответ:
Событие resize срабатывает при прокрутке страницы. Почему - не понял. Значение ширины страницы не меняется. И опять же -это происходит на Android и iOS (на Windows Phone все нормально).
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Нужно дописать модальное окно NewsForUs Events/DOM/Window 0 25.03.2013 13:27
Передача данных из форм в модальное окно. andrey96 AJAX и COMET 5 16.11.2012 16:47
Кроссбраузерное модальное окно Logo Events/DOM/Window 3 27.04.2012 09:56
Подскажите как открыть модальное окно "fancybox" из скрипта js dgabets jQuery 1 18.02.2012 18:05
Как запустить модальное окно из информационного окна google maps? www123 jQuery 5 04.09.2011 23:38