2010-09-23 6 views
0
$(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'); 

});jQuery redimensionnement

Je veux slideWidth changer en fonction de la taille de la fenêtre alors quand la fenêtre est redimensionnée les changements slideWidth mais je ne semble pas être en mesure d'obtenir ce travail.

Est-ce que quelqu'un sait pourquoi?

Répondre

0

Il ne sera pas mise à jour d'autres variables, slideWidth est une autre variable distincte, une copie de la valeur à chaque fois qu'il WinSize a été mis au départ, vous avez besoin de quelque chose comme ceci dans votre fonction de mettre à jour à la fois:

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

Assurez-vous que slideWidth est portée pour que cette mise à jour de la même variable slideWidth, et non la création d'un marché mondial. Sinon, il suffit d'utiliser WinSize pour votre code, il n'y a pas besoin de 2 variables, du moins pas dans votre exemple ... peut-être il y a un besoin dans le reste de votre code.

+0

Désolé pourriez-vous expliquer que je ne suis pas trop sûr – Brob

+0

@Brob - Quelle partie? Votre meilleur pari, sauf si vous avez besoin d'une autre variable, est d'utiliser juste 'WinSize' dans votre code, * probablement * pas besoin de la variable supplémentaire qui n'est pas mise à jour. –

+0

Le code a été mis à jour pour montrer la fonction entière – Brob

Questions connexes