Вопрос

На следующем коде показано меню под названием #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 (не требуется для моей версии мобильного сайта). Исправлено это.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top