2012-09-30 22 views
8

Tengo un pequeño problema con el cambio de tamaño de ventana usando la función .resize() de jQuery. Me gustaría saber qué dimensión se hace más grande/más pequeña: ancho o alto. Necesito esto porque si acabo de poner dos condiciones - si el ancho es de 50 px más grande que div y si la altura es de 50 px más grande que div,jQuery - ¿Cómo saber si la ventana está cambiando de tamaño en ancho/alto o en ambas?

// (pseudocode) 
if width = div.width + 50px 
    width = something 
if height = div.height + 50px 
    height = something 

continuación, está trabajando en una sola condición y que puede cambiarse el tamaño de ancho o altura.

¿Cómo podría saber qué dimensión está cambiando de tamaño o si ambas son?

+2

¿Por qué no publicar su código que ha intentado.? –

Respuesta

19

Guardando los últimos valores de tamaño de ventana en las variables.

var h = $(window).height(), w = $(window).width(); 
$(window).resize(function(){ 

    var nh = $(window).height(), nw = $(window).width(); 
    // compare the corresponding variables. 
    h = nh; w = nw; // update h and w; 
}); 
3

Guarde el tamaño anterior y compárelo con él, cada vez que cambie el tamaño.

Por ejemplo:

var prevW = -1, prevH = -1; 

$(document).ready(function() { 

    // ... other stuff you might have inside .ready() 

    prevW = $(window).width(); 
    prevH = $(window).height(); 
}); 

$(window).resize(function() { 
    var widthChanged = false, heightChanged = false; 
    if($(window).width() != prevW) { 
     widthChanged = true; 
    } 
    if($(window).height() != prevH) { 
     heightChanged = true; 
    } 

    // your stuff 

    prevW = $(window).width(); 
    prevH = $(window).height(); 

}); 

Demostración:http://jsfiddle.net/44aNW/

+0

Debe guardar el ancho/alto anterior después de = verdadero para que funcione más de una vez. –

+0

Ahh, eso es correcto. Corregido ahora. – techfoobar

+0

Esto no funciona del todo. Funciona solo por segundo si la condición y no para ambos. – user1257255

Cuestiones relacionadas