jquery toggleclass ошибка на iPhone
-
26-10-2019 - |
Вопрос
На следующем коде показано меню под названием #wrap-footer
Сдвинув его, когда вы нажимаете #menu-button
. Анкет Нажатие в любом месте на странице, за исключением меню, заставляет его скользить обратно.
Когда меню видно #menu-button
имеет класс, добавленный к нему под названием «Открыть меню» (используется для стиля). Когда меню снова скрыто, класс удаляется.
Обратите внимание, я использовал селекторы #wrap-header
, #wrap-pre-footer
, #wrap-content
а не просто html
или же document
Поскольку iPhone не распознает их.
$(document).ready(function(){
$("#menu-button a").hide();
$('#menu-button').append('Menu');
$('#wrap-header,#wrap-pre-footer,#wrap-content').click(function() {
$('#wrap-footer').slideUp('slow');
$('#menu-button').removeClass('menu-open');
});
$('#menu-button').click(function(event){
event.stopPropagation();
$('#menu-button').toggleClass('menu-open');
$('#wrap-footer').slideToggle('slow');
});
$("#wrap-footer").click(function(e) {
e.stopPropagation();
});
});
На рабочем столе все в порядке. Однако на iPhone Slidetoggle работает нормально, но Toggleclass никогда не удаляет класс. Так что, если меню открыто, щелкнув на страницу (но не #menu-button
или же #wrap-footer
) минимизирует меню и удаляет класс, но нажимая #menu-button
только минимизирует меню и не удаляет класс.
Спасибо
Решение
Оказывается, JS был в порядке. Настоящей проблемой был класс CSS Hover. На iPhone последний элемент, на который вы нажимаете, сохраняется как состояние зависания. Удаление класса CSS Hover (не требуется для моей версии мобильного сайта). Исправлено это.