Comment puis-je actualiser des fonctions à la page redimensionnent en jquery

Question

DEMO : j'ai un ensemble de fonctions utilisées dans RWD,

La question est I'am face à chaque fois que je dois rafraîchir la page pour exécuter les fonctions, Y at-il un moyen de FONCTIONS DE RAFRAICHISSEMENT. iam utilisant bootstrap, require.js

Quelqu'un peut-il nous éclairer là-dessus, les fonctions pour lesquelles iam rafraichit sont dues aux composants personnalisés.

Code

exemple:

$(function() { 

       function toggleNavbarMethod() { 
        if ($(window).width() > 1024) { 
         $('nav .score-megamenu-dropdown').on('mouseover', function() { 
          $('.dropdown-toggle', this).trigger('click'); 
         }).on('mouseout', function() { 
          $('.dropdown-toggle', this).trigger('click').blur(); 
         }); 
        } 
        else { 
         $('nav .score-megamenu-dropdown').off('mouseover').off('mouseout'); 
        } 
       } 
       toggleNavbarMethod(); 
       $(window).resize(toggleNavbarMethod); 


       var PGBRAUN = PGBRAUN || {}; 

       PGBRAUN = { 
        globalVars: { 
         onPageLoad: '', 
         MD_min_width: 992, 
         XS_max_width: 767, 
         SM_min_width: 768, 
         SM_max_width: 991 
        }, 
        domReady: function() { 
         $('.mob-header').parent('.container').hide(); // hiding sign in and signup container in dt 
        }, 
        preventLinks: function() { 
         /* anything needed to run at DOM load (not page load) would be declared here */ 
         var stopFromLinking = ".score-header ul.header-category li:first-child, .score-footer ul.footer-social-share li:first-child, a.menu-links"; 
         $(document).on('click', stopFromLinking, function (e) { 
          e.preventdefault(); 
         }) 
        }, 
        megaMenuSP: function() { 
         if ($(window).width() < 991) { 
          /* Changing Menu slide-collapse attribute on ready */ 
          $('.score-hamburger.navbar-toggle').attr('data-toggle', 'slide-collapse'); 

          /* Adding of new div for slide container starts*/ 
          $('.score-header').after($('<div id="navbar-height-col"></div>')); 
          $(".mob-header, .navbar-collapse").wrapAll("<div id='slidemenu'></div>"); 
          //$('html .mob-header').prependTo('.navbar-collapse'); 

          var slidewidth = '80%'; 
          var navbarneg = '-' + slidewidth; 

          /* Adding of new div for slide container ends*/ 

          $('#navbar-height-col').css({ 
           "width": slidewidth, 
           "right": navbarneg 
          }); 

          $('#slidemenu').css({ 
           "width": '86.7%', 
           "right": navbarneg 
          }); 
          $('.navbar-toggle').addClass('collapsed'); 
          $('.page-wrapper').attr('id', 'page-content'); 
          navVisible = 0; 

          /* Main Menu Button Hamburger starts */ 
          $(document).on('click', '.navbar-toggle', function (e) { 
           //debugger; 
           /* Show Close Icon starts */ 
           $(this).toggleClass('collapsed'); 
           $(this).toggleClass('collapsed').attr('aria-expanded', 'true'); 
           /* Show Close Icon ends */ 

           /* Hiding Images from Ul dd start */ 
           $('ul.dropdown-menu').find('.header-mega-menu-view-all-button, .header-mega-menu-img').hide(); 
           /* Hiding Images from Ul dd ends */ 

           /* Adding Class for Mobile View starts -> check can this be added on load */ 
           $('.score-megamenu-dropdown').find('.menu-links').addClass('dropdown-toggle toggle-caret button-caret').attr('data-toggle', 'dropdown'); 
           /* Adding Class for Mobile View ends */ 

           /* Finding Mob Sign in Link and Prepending before Navigation starts */ 
           // $('html .mob-header').prependTo('.collapse.navbar-collapse'); 
           /* Finding Mob Sign in Link and Prepending before Navigation ends */ 


           /* Show right side Menu starts */ 

           $('.mob-header').toggle(); 
           $('.navbar-collapse').toggle('collapse'); 

           //$('.mob-header').show(); 

           var selected = $(this).hasClass('slide-active'); 

           $('#slidemenu').stop().animate({ 
            //right: selected ? navbarneg : '0px' 
            right: selected ? navbarneg : '-15px' 
           }); 

           $('#navbar-height-col, #page-content').stop().animate({ 
            right: selected ? navbarneg : '0px' 
           }); 

           $('#page-content').stop().animate({ 
            right: selected ? '0px' : slidewidth 
           }); 

           $('.navbar-header').stop().animate({ 
            right: selected ? '0px' : slidewidth 
           }); 

           $('.score-footer').stop().animate({ 
            right: selected ? '0px' : slidewidth 
           }); 

           $('.score-footer .container').stop().animate({ 
            right: selected ? '0px' : slidewidth 
           }); 

           $(this).toggleClass('slide-active', !selected); 

           $('#slidemenu').toggleClass('slide-active', 'fast'); 

           //$('body, #page-content, .navbar, .navbar-header, .score-footer, .score-footer .container').toggleClass('slide-active'); 
           $('body, #page-content, .navbar, .navbar-header, .score-footer, .score-footer').toggleClass('slide-active'); 

           //$('.score-footer .container').hide(); 

           //$('.slide-menu-content').toggle(); 

           //$("body").append('<div class="back-drop" style="position: fixed;height: 100%;width: 100%;top: 0;right:83%;z-index: 990;"><\/div>'); 
           navVisible == 0 ? (navVisible = 1, 
            $("body").css("cursor", "pointer"), 
            $("body").append('<div class="back-drop" style="position: fixed;height: 100%;width: 100%;top: 0;right:83%;z-index: 990;"><\/div>')) : (navVisible = 0, 
             $("body").css("cursor", "inherit"), 
             $(".back-drop").remove()) 
           //: (navVisible = 0, $("body").css("cursor", "inherit"), $(".back-drop").remove() 

           /* Show right side Menu ends */ 
          }); 

          $(document).on('click', '.back-drop, #navbar-height-col', function() { 
           $('.navbar-toggle.slide-active').trigger('click'); 
          }) 

          /* Main Menu Button Hamburger ends */ 

          /* Sub Menu starts */ 
          $('.header-mega-menu a').click(function (e) { 
           if ($(this).hasClass('menu-links')) { 

            if ($(this).hasClass('submenu-menu')) { 
             $(this).removeClass('submenu-menu'); 
             $(this).next().next('.dropdown-menu').hide(); 
             $(this).parents('.header-mega-menu').find('li').removeClass('open'); 
            } else { 
             $('a.dropdown-toggle').removeClass('submenu-menu'); 
             $(this).parents('.header-mega-menu').find('li').removeClass('open'); 
             $(this).parent().addClass('open'); 
             $(this).addClass('submenu-menu'); 
             $('.dropdown-menu').hide(); 
             $(this).next().next('.dropdown-menu').show(); 
            } 
           } 
           if ($(this).hasClass('sub-menu-first-child')) { 
            if ($(this).hasClass('submenu-menu')) { 
             $(this).removeClass('submenu-menu'); 
             //$(this).parent().next('.dropdown-menu').hide(); 
             $(this).next('.dropdown-menu').hide(); 
            } else { 
             $('a.sub-menu-first-child').removeClass('submenu-menu'); 
             $(this).addClass('submenu-menu'); 
             $('.header-mega-menu-content').find('.dropdown-menu').hide(); 
             //$(this).parent().next('.dropdown-menu').show(); 
             $(this).next('.dropdown-menu').show(); 
            } 
           } 
           e.stopPropagation(); 
           e.preventDefault(); 
          }) 
          /* Sub Menu ends */ 
         } 

         var selected = '#slidemenu, #page-content, body, .navbar, .navbar-header, .score-footer'; 

         $(window).on("resize", function() { 
          if ($(window).width() < 991 && $('.navbar-toggle').is(':hidden')) { 
           $(selected).removeClass('slide-active'); 
          } 
         }); 
        }, 
        promoBlockMatchHeight() { 
         $(".promo-match-height").each(function() { 
          var $promoleft = $(this).find(".score-left .caption"); 
          var $promoRight = $(this).find(".score-right .caption"); 

          $promoleft.height(''); 
          $promoRight.height(''); 

          var promoLeftHeight = $promoleft.innerHeight(); 
          var promoRightHeight = $promoRight.innerHeight(); 

          var heightVal = (promoLeftHeight == promoRightHeight) ? promoLeftHeight : promoRightHeight; 

          $promoleft.css({ 
           "height": heightVal 
          }); 
          $promoRight.css({ 
           "height": heightVal 
          }); 
         }); 
        }, 
        accordianList: function() { 
         $(".cate-navigator").find(".cat-nav-list-title").click(function (e) { 
          e.preventDefault(); 
          var $content = $(this).nextAll(".cat-nav-list"); 
          $(".cate-navigator").find(".cat-nav-list").not($content).hide(); 
          //$(this).nextAll(".cat-nav-list").toggle(); 
          $(this).nextAll(".cat-nav-list").toggleClass('display-block'); 
         }); 
        }, 
        init: function() { 
         PGBRAUN.domReady(); 
         PGBRAUN.preventLinks(); 
         PGBRAUN.megaMenuSP(); 
         PGBRAUN.promoBlockMatchHeight(); 
         PGBRAUN.accordianList(); 
        }/*, 
        onWindowResizeRefresh: function() { 
         PGBRAUN.init(); 
        }*/ 
       } 
       return PGBRAUN.init(); 
      }); 

Answer 1

Comme je l'ai déjà mentionné dans les commentaires, vous devez utiliser la fonction unbind() avant d'ajouter le mouseover événement à votre élément 'nav .score-megamenu-menu déroulant', il ne liera pas le même événement X fois que vous redimensionnez la fenêtre.

function toggleNavbarMethod() { 
    if ($(window).width() > 1024) { 
     $('nav .score-megamenu-dropdown').unbind('mouseover'); // unbind the event 
     $('nav .score-megamenu-dropdown').on('mouseover', function() { 
      $('.dropdown-toggle', this).trigger('click'); 
     }).on('mouseout', function() { 
      $('.dropdown-toggle', this).trigger('click').blur(); 
     }); 
    } 
    else { 
     $('nav .score-megamenu-dropdown').off('mouseover').off('mouseout'); 
    } 
}