在JQUERY中重置切换

时间:2014-11-28 11:38:14

标签: javascript jquery toggle slidetoggle

我正在尝试构建移动幻灯片菜单,并希望在移动设备上添加幻灯片效果的.on("swipeleft",...)功能。然而,我遇到的问题是当用户将菜单滑回时它会卡住并重复该功能,因为它回顾mobileMenuSlideIn()。这意味着用户需要两次单击按钮。我要做的是检查函数是否被调用,如果不重复它。我怎么能这样做?

function mobileMenu(){
    /* Slide out function */
    function mobileMenuSlideOut(){
        jQuery('.mobile-wrapper').animate({ marginLeft: "70%" }, 'slow', function() {
            jQuery(".mobile-wrapper").css("position", "fixed"); 
        });
        jQuery('.mobile-wrapper-sidebar').animate({ marginLeft: "0px" }, 'slow');
    }   
    /* Slide int function */
    function mobileMenuSlideIn(){   
        jQuery('.mobile-wrapper').animate({ marginLeft: "0px" }, 'slow', function() {
            jQuery(".mobile-wrapper").css("position", "relative");
        });
        jQuery('.mobile-wrapper-sidebar').animate({ marginLeft: "-70%" }, 'slow');
    }   
    /* Toggle to create mobile menu */
    jQuery('[data-toggle="mobile-wrapper"]').toggle(     
            /* Add the swipe function for mobile */
            function() {    
                mobileMenuSlideOut();

                jQuery( ".mobile-wrapper" ).on("swipeleft", function() {    
                    mobileMenuSlideIn();    
                });
            },
            function() { 
                if ( !mobileMenuSlideIn()) {
                    mobileMenuSlideIn();
                }
                else {
                    //do nothing

                }
            }
    );

0 个答案:

没有答案