Запустить JQuery на размер окна

Question

Я использую j-query, чтобы установить высоту div так же, как width.It теперь работает нагрузка, но я хочу, чтобы она запускалась при изменении размера окна.

Я использую это:

<script> 
$(document).ready(function(){ 
$('.source').each(function(){ 
    var currentWidth = $(this).width(); 
    $(this).height(currentWidth); 
}) 
}) 

Answer 1

Это просто изменение код @Bala

// ready event 
$(function() { 
    function test() { 
     $('.source').each(function() { 
      var self = $(this); 
      self.height(self.width()); 
      // but how the width is changing? 
     }); 
    }(); //calling the function 

    // resize event 
    $(window).resize(test); 
}); 

BTW, как ширина меняется?

Answer 2

$(document).resize(function(){ 
    //do things here 
}); 

Answer 3

Вы можете использовать так:

$(window).on('resize',function(){ 
$('.source').each(function(){ 
    var currentWidth = $(this).width(); 
    $(this).height(currentWidth); 
}) 
}).resize();//runs at first load 

Answer 4

$(window).on('resize', function(){ 
    $('.source').each(function(){ 
     var currentWidth = $(this).width(); 
     $(this).height(currentWidth); 
    }); 
}); 

$(document).ready(function(){ 
    $('.source').each(function(){ 
     var currentWidth = $(this).width(); 
     $(this).height(currentWidth); 
    }); 
}); 

или даже лучше, поставить дублирующий код в отдельная функция:

$(window).on('resize', function(){ 
    changeWidth(); 
}); 

$(document).ready(function(){ 
    changeWidth(); 
}); 

function changeWidth() { 
    $('.source').each(function(){ 
     var currentWidth = $(this).width(); 
     $(this).height(currentWidth); 
    }); 
} 

Answer 5

использование window.resize() событие в JQuery

function test() { 
    $('.source').each(function() { 
     var currentWidth = $(this).width(); 
     $(this).height(currentWidth); 
    }); 
} 

$(document).ready(function() { 
    test(); 
    $(window).resize(test); 
});