Несколько модальных страниц на одной странице с использованием простого Jquery (отзывчиво на Deskop и Mobile) - PullRequest
Новая
       8

Несколько модальных страниц на одной странице с использованием простого Jquery (отзывчиво на Deskop и Mobile)

0 голосов
/ 08 декабря 2018

Я создал модал, который отлично работает на рабочем столе, но на мобильном телефоне, когда я щелкаю за пределами модальной области, экран остается открытым,

Есть ли способ исправить это для мобильных устройств?или мне нужно включить 'X', чтобы закрыть?

Я пытался включить 

$(document).click(function(){
    $("#port-content-1").hide('fast');
});

$("#port-content-1").click(function(e){
    e.stopPropagation();
});

вместо 

window.onclick = function(event) {
    if (event.target == modal) {
        modal.style.display = "none";
    }
}

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

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

КодЯ имею в виду это: https://jsfiddle.net/joshtrose/g80vknyL/

1 Ответ

0 голосов
/ 08 декабря 2018

Я исправил обе проблемы с: 

$(".button").on("click", function() {
var modal = $(this).data("modal");
$(modal).show();
});

$(".modal").on("click", function(e) {
var className = e.target.className;
if(className === "modal" || className === "close"){
  $(this).closest(".modal").hide();
}
});

Нашел здесь: https://www.sitepoint.com/community/t/how-to-get-this-script-to-work-for-multiple-modal-popups/252443/7

Такое эффективное решение, о котором ребята ходят, есть легенды.

...