简体   繁体   English

手机菜单不会在iPhone上关闭

[英]Mobile menu doesn't close on iPhone

I'm told that the mobile menu on my page (accessible through the 3 horizontal bars icon top right) doesn't close on iPhone. 我被告知我的页面上的移动菜单 (可通过右上方的3个水平条图标访问)在iPhone上没有关闭。 I can't check myself because I don't have Apple devices (on online iPhone simulators it does work though) but I don't see why it would work on Android and not on iPhone. 我无法检查自己,因为我没有Apple设备(在线iPhone模拟器上它确实有效)但我不明白为什么它可以在Android而不是在iPhone上运行。

Here's the JS code controlling the mobile menu: 这是控制移动菜单的JS代码:

$( '#mobile_menu_icon' ).click(function() {
    if( $( '.mobile_header_menu' ).css( 'right' ) == '-280px' ) { 
        $( '.mobile_header_menu' ).animate( { right: '0' }, open_delay, 'easeInOutExpo' );  
        $( '#wrap' ).animate({ right: '280px' }, open_delay, 'easeInOutExpo' );
        $( 'body' ).addClass( 'overflow_hidden' );
    }
    else { 
        $( '.mobile_header_menu' ).animate({ right: '-280px' }, close_delay, 'easeInOutExpo' );
        $( '#wrap' ).animate({ right: '0' }, close_delay, 'easeInOutExpo' );    
        $( 'body' ).removeClass( 'overflow_hidden' );
    }
    return false;
});
$( document, '.mobile_header_menu_close' ).click(function() {
    if( $( '.mobile_header_menu' ).css( 'right' ) == '0px' ) {
        $( '.mobile_header_menu' ).animate({ right: '-280px' }, close_delay, 'easeInOutExpo' );
        $( '#wrap' ).animate({ right: '0' }, close_delay, 'easeInOutExpo' );
        $( 'body' ).removeClass( 'overflow_hidden' );   
    }
});
$( '.mobile_header_menu_inner' ).click(function( event ) {
    event.stopPropagation();
});

I removed the following piece and it worked. 我删除了以下部分并且它有效。 Don't understand why it was problematical on iPhones. 不明白为什么它在iPhone上有问题。

$( '.mobile_header_menu_inner' ).click(function( event ) {
    event.stopPropagation();
});

It works just fine. 它工作得很好。

(Tested on iOS 9.1, 9.0 and 8.4 on the Xcode simulator and a iPhone 6 (iOS 9.1) and iPad Air (9.0)). (在Xcode模拟器和iPhone 6(iOS 9.1)和iPad Air(9.0)上测试iOS 9.1,9.0和8.4)。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM