JS поп ап не работает в safari

142

31 июля 2019, 19:50

Простецкий попап, работает везде, кроме айфона и айпада

Код JS:

//Функция отображения PopUp
function PopUpShow(){
    $("#popup1").show();
}
//Функция скрытия PopUp
function PopUpHide(){
    $("#popup1").hide();
}

Разметка:

    <a href="javascript:PopUpShow()" id="pop-show">сюда</a>
<div onclick="PopUpShow()"><i class="fas fa-phone"></i> </div>
<div class="b-popup" id="popup1">
<div class="b-popup-content">
<a class="b-popup-close" href="javascript:PopUpHide()">
<div class="col-md-4 col-12 padding-pop"> <div class="left-cont-pop">Наши контакты</div> <div class="right-cont-pop" id="pop-hide"> Х</a></div></div>
<div class="row">
<div class="col-md-4 col-12 padding-pop"><i class="fas fa-phone"></i></div>
<div class="col-md-4 col-12 padding-pop"><i class="fas fa-phone"></i></div>
<div class="padding-pop-text">Остались вопросы? Позвоните нам, мы всегда поможем Вам с выбором.</div>
</div>
</div>
</div>

Подскажите, пожалуйста, как решить проблему? UPD:Разметку обновил

Answer 1

Ну, вообще-то правило хорошего тона - это когда в html только разметка, а скрипты вынесены в отдельный js-файл.

Попробуйте убрать href у ссылок (этот атрибут не является обязательным), задайте им какие-то id (например, pop-show и pop-hide) и в js пропишите:

$('#pop-show').click(function(){
  $("#popup1").show();
});
$('#pop-hide').click(function(){
  $("#popup1").hide();
});

Answer 2

Оказалось, что дело не в JS. Попап открывался, но... он был прозрачным. display: flex в сафари сделал весь попап просто прозрачным. Заменил на block и все отлично. А у меня теперь есть пара вопросов к разработчикам IOS...