изменение размера окна jQuery

Question

$(document).ready(function(){  
WinSize = $(window).width(); 
var currentPosition = 0; 
var slideWidth = WinSize; 

$(function(){ 
    $(window).resize(function(){ 
     slideWidth = WinSize = $(window).width(); 
    }); 
});  


var slides = $('.slide'); 
var numberOfSlides = slides.length; 

// Remove scrollbar in JS 
$('#slidesContainer').css('overflow', 'hidden'); 

// Wrap all .slides with #slideInner div 
slides 
.wrapAll('<div id="slideInner"></div>') 
// Float left to display horizontally, readjust .slides width 
.css({ 
    'float' : 'left', 
    'width' : slideWidth 
}); 

// Set #slideInner width equal to total width of all slides 
$('#slideInner').css('width', slideWidth * numberOfSlides); 

// Insert controls in the DOM 
$('#PageBG') 
.prepend('<a href="#" class="control" id="previous"><span>Previous</span></a>') 
.append('<a href="#" class="control" id="next"><span>Next</span></a>'); 

// Hide left arrow control on first load 
manageControls(currentPosition); 

// Create event listeners for .controls clicks 
$('.control') 
.bind('click', function(){ 
    // Determine new position 
    currentPosition = ($(this).attr('id')=='next') ? currentPosition+1 : currentPosition-1; 

    // Hide/show controls 
    manageControls(currentPosition); 
    // Move slideInner using margin-left 
    $('#slideInner').animate({ 
     'marginLeft' : slideWidth*(-currentPosition) 
    },800, 'linear'); 
}); 

$('.SlideSelect') 
.bind('click', function(){ 

// Move slideInner using margin-left 
$('#slideInner').animate({ 
    'marginLeft' : slideWidth*(-$(this).attr('id')) 
},800, 'linear'); 

});

Я хочу, чтобы slideWidth изменялся в зависимости от размера окна, поэтому при изменении размера окна slideWidth меняется, но я, похоже, не могу заставить это работать.

Кто-нибудь знает, почему?

Answer 1

Это не будет обновлять другие переменные, slideWidth это другая, отличная переменная, копия значения в WinSize всякий раз, когда он изначально был установлен, вам нужно что-то подобное в вашей функции, чтобы обновить как:

$(function(){ 
    $(window).resize(function(){ 
     slideWidth = WinSize = $(window).width(); 
    }); 
}); 

Убедитесь, что slideWidth находится в области видимости, так что это обновляет ту же переменную slideWidth, а не создает глобальную. В качестве альтернативы просто используйте WinSize для вашего кода, нет необходимости в двух переменных, по крайней мере, в вашем примере ... возможно, в остальной части вашего кода есть необходимость.