图像调整窗口大小

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

这是因为它是一个不同的独特价值，如果你想改变哟需要直接改变它，就像这样：

WinSize = $(window).width(); 
var slideWidth = WinSize; 

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

，或直接使用WinSize，不管你用它做，因为它已经更新了。