How to know if you are doing resize in width or height?

5

Is there any way to see if the resize() of the window is occurring in width or is occurring at the height?

    
asked by anonymous 31.01.2014 / 19:17

3 answers

10

Save the height () and / or the width () of the object in a variable and compare the callback with the previous value.

Example running on JSFiddle
Change width or height of window "result" to see ...

jQuery:

// guardar valores em uso
var h = $(window).height(),
    w = $(window).width();

// realizar verificação
$(window).resize(function(){

    // recolher valores actuais
    var nh = $(window).height(),
        nw = $(window).width();

    /* comparar os valores antigos com os novos
     * e realizar acção pretendida aqui!
     */

    // atualizar os valores nas variáveis que guardam o valor antigo
    h = nh; w = nw;
});

Sample credit for @Anoop in SOEN in this answer .

    
31.01.2014 / 19:24
2

Try something like this:

$(document).on('ready', function() {
    var width = $(window).width(), height = $(window).height();

    $(windows).on('resize', function() {
        if($(window).width() != width) {
          console.log('A largura mudou para'+$(window).width());
        }

        if($(window).height() != height) {
          console.log('A altura mudou para'+$(window).height());
        } 
    });
});

My response is very similar to that of the friend above, but I was already writing when you started, so I decided to send it anyway:)

    
31.01.2014 / 19:38
1

You can use Jquery UI. It provides more functions about resize.

For example, as the function returns the Object and in this object we have the original propertySize. This will make it easier to find the original size.

resize: function(event, ui) { 
    ui.originalSize.width;
}

The doc will help you a lot if you are interested. Jquery Ui

    
31.01.2014 / 19:40