Переключатель jQuery не работает на iPhone8 или других устройствах iOS - PullRequest
Новая
       7

Переключатель jQuery не работает на iPhone8 или других устройствах iOS

0 голосов
/ 16 сентября 2018

Привет, ребята, у меня есть заголовок, который на маленьком экране показывает меню гамбургеров. Когда я нажимаю на меню гамбургера на ПК или на телефоне Android, он делает именно то, что я хочу, но когда я делаю это на iOS на моем iPhone 8, он ничего не делает. Я поместил туда предупреждение, чтобы узнать, распознает ли он даже мое касание, и использует ли оно $ (". MyMenu"). Click (function () {alert ("clicked div");}); , Но я пробовал slideToggle, toggle и hide / show, но ни один из них не работает, и это имеет проблему только на iOS. Я читал другие форумы, и кто-то сказал, чтобы они были окружены якорными тегами, но это не помогло. Другие говорили, что мне нужно установить css на курсор: указатель, и это не сработало. Кто-то предложил очистить кеш в браузере, и это не сработало. Я нашел другие CDN на github, которые решают проблему и не работают. Я прочитал, что была проблема с ajax, поэтому нужно было установить значение false, что выделено в моем коде ниже, и это не сработало. Последний совет, который я нашел, состоял в том, чтобы гарантировать, что показ был установлен, чтобы заблокировать, и это не работало. Я, вероятно, использую больше CDN, чем мне нужно, но на данный момент я просто добавляю те, которые, на мой взгляд, актуальны, чтобы увидеть, делают ли они что-нибудь. Я посмотрел столько, сколько я могу, и я не знаю, куда еще обратиться. Любая помощь очень ценится.

Вот мой jsfiddle ...... https://jsfiddle.net/62pmq7ju/9/

<div class="header">

<a><div><img src="img/icon.png" alt="" width="40px" height="45px" class="myMenu"/></div></a>
<div class="hiddenMenu"></div>
</div>

.hiddenMenu {
position: fixed;
width: 100%;
background-image: url(img/headerBackground.jpg);
top:45px;
display: block;
cursor: pointer;
}

.myMenu {
position: relative;
float: left;
padding-left: 5px;
display: block;
cursor: pointer;
}

    <script>
    $(document).bind("mobileinit", function () {
    // jQuery Mobile's Ajax navigation does not work in all cases (e.g.,
    // when navigating from a mobile to a non-mobile page), especially when going back, hence disabling it.
    $.extend($.mobile, {
        ajaxEnabled: false
    });
    }); 
    $(".hiddenMenu").hide();
    $(".myMenu").on("click", function(){
       $(".hiddenMenu").toggle(); 
    });
    </script>

jsfiddle не работает на Chrome или Safari на моих устройствах iOS, но работает на моем устройстве Android и ноутбуке вдов. Пожалуйста, любая помощь будет оценена, я работаю над этим в течение последних трех дней, и я не знаю, где еще искать. Если я что-то упустил в своем посте, прошу прощения и сообщите, что вам нужно.

...