更新窗口大小变量的问题

issue updating variable on window resize

本文关键字:问题 变量 窗口大小 更新      更新时间:2023-09-26

我对浏览器窗口的大小有一个条件,但我的变量"windowsize"没有得到更新,只有在文档加载的值是一个考虑。我做错了什么,我需要一个全局变量吗?

我有:

jQuery(function(){
    jcf.customForms.replaceAll();
    initCarousel();
    initCycleCarousel();
    initSlideShow();
    initOpenClose();
    initAccordion();
    jQuery('input, textarea').placeholder();
    .....
    ...
});
.....
...
// open-close init
function initOpenClose() {
var $window = $(window);
var windowsize = $window.width();
$(window).resize(function() {
  windowsize = $window.width(); 
});
  if (windowsize > 1200) {
    //if the window is greater than 1200px wide then..
        jQuery('#nav > ul > li').openClose({
            activeClass: 'active',
            opener: '> a',
            slider: '.drop-container',
            animSpeed: 200,
            event: 'over',
            effect: 'slideAlt'
        });
  }
  if (windowsize < 1200) {
    //if the window is greater than 1200px wide then..
        jQuery('#nav > ul > li').openClose({
            activeClass: 'active',
            opener: '> a',
            slider: '.drop-container',
            animSpeed: 400,
            event: 'click',
            effect: 'slideAlt'
        });
  }
});

}

Try with

  jQuery(function(){
      updateContainer(); // Initial load call to check it did not require resize
  });
  $(window).resize(function () {
        updateContainer(); // If Resize happens call to check
   });
 function updateContainer() {
    var windowsize = $(window).width();
    if (windowsize > 1200) {
        //if the window is greater than 1200px wide then..
        jQuery('#nav > ul > li').openClose({
            activeClass: 'active',
            opener: '> a',
            slider: '.drop-container',
            animSpeed: 200,
            event: 'over',
            effect: 'slideAlt'
        });
    }
  else
  {  
      jQuery('#nav > ul > li').openClose({
        activeClass: 'active',
        opener: '> a',
        slider: '.drop-container',
        animSpeed: 400,
        event: 'click',
        effect: 'slideAlt'
       });
   }
}

试一下,

function initOpenClose() 
{
     var $window = $(window);
     var windowsize = $window.width();
     updateWindow();
     $(window).resize(function() {
          windowsize = $window.width(); 
          updateWindow();
     });
     function updateWindow()
     {
         if (windowsize > 1200) 
         {
                   //if the window is greater than 1200px wide then..
             jQuery('#nav > ul > li').openClose({
                activeClass: 'active',
                opener: '> a',
                slider: '.drop-container',
                animSpeed: 200,
                event: 'over',
                effect: 'slideAlt'
             });
        }
        else if (windowsize < 1200) 
        {
            //if the window is greater than 1200px wide then..
           jQuery('#nav > ul > li').openClose({
                activeClass: 'active',
                opener: '> a',
                slider: '.drop-container',
                animSpeed: 400,
                event: 'click',
                effect: 'slideAlt'
            });
         }
      }
}