点击另一个菜单时关闭菜单和图标图像?

时间:2016-08-15 13:01:39

标签: jquery css mobile

点击汉堡菜单时,搜索菜单应该关闭,其图标应该是搜索而不是十字架,点击搜索菜单时,汉堡菜单应该关闭,图标转换为汉堡不能保持交叉。&#39 ;

// Mobile/tablet navigation (clicks, taps)              
$('.toggle-sm-nav, .js-toggle-sm-navigation').click(function(){

                    // Change button
                    $(this).children('span').toggleClass('glyphicon-align-justify icon-close-menu-cross2');

                    // Toggle menu on hamburger
                    $('.navcontainer').toggle();
                    $('.header-nav-container').toggleClass('brgropen');

                    if( $('.header-nav-container').hasClass('brgropen') ){
                        $('body').css('overflow', 'hidden');
                    } else {
                        $('body').css('overflow', 'visible');
                    }

另一个菜单搜索

打开时关注搜索字段

    $('.js-toggle-xs-search').on('click', function(){
        $('.sm-searchboxc input#search').trigger('touchstart');
    });

1 个答案:

答案 0 :(得分:0)

       if ($('.xs-search > button > span').hasClass('icon-close-menu-cross2')) {
         $('.xs-search > button > span').removeClass('icon-close-menu-cross2').addClass('icon-search');
         $('.sm-searchboxc input#search').hide();
         $('.searchboxc').find('.site-search').removeClass('active');
       }
       $('.navcontainer').toggle();
       $('.header-nav-container').toggleClass('brgropen');
       if ($('.header-nav-container').hasClass('brgropen'))

         $('.js-toggle-xs-search').on('click', function() {
         var width = $(window).width();
         if (width <= 968) {
           if ($('.sm-searchboxc input#search').hide()) {
             $('.sm-searchboxc input#search').show();
           } else if ($('.xs-search > button > span').hasClass('icon-close-menu-cross2')) {
             $('.sm-searchboxc input#search').trigger('touchstart');
           }
           if ($('.header-nav-container').hasClass('brgropen')) {
             $('.toggle-sm-nav, .js-toggle-sm-navigation').children('span').toggleClass('glyphicon-align-justify icon-close-menu-cross2');
             $('.navcontainer').hide();
             $('.header-nav-container').removeClass('brgropen');
           }
         } else {
           $('.sm-searchboxc input#search').trigger('touchstart');
         }
       });
       $('.sm-searchboxc input#search').on('touchstart', function() {
             setTimeout(function() {
                   $('.sm-searchboxc input#search').focus();