jquery - 使用 jQuery，如何在加载和调整大小时调整子元素的大小

Question

我有一个非常基本的功能：

 function bx_thumbs() {
    pager_count = jQuery('.bx-pager').children().size();
    total_width = jQuery('.bx-pager').width();
    item_width_margin = pager_count*16;
    page_width = total_width-item_width_margin;
    item_width = page_width/pager_count;

    jQuery('.bx-pager a img').each(function(){
        jQuery(this).css('width',item_width+'px')
        console.log('hi' + total_width);        
    });  
}

jQuery(document).ready(function() {
  bx_thumbs();
});
jQuery(window).resize(function() {
  bx_thumbs();
 });

这样做的目的是将图像设置为使所有内容都在一行中的宽度。

这在负载时工作得很好。但是在我获取控制台日志时调整大小时，图像会失去宽度设置。

您可以在http://simpleandcrisp.com/pairings看到这一点

我在我的css中设置了css max-width，这样如果js被停用，它就不会炸毁页面......只是无法弄清楚为什么它在调整大小时不起作用。

提前致谢

Answer 1

上面的 SegioCruz 指出：

试试这个： jQuery(document).ready(function() { jQuery(window).resize(function() { bx_thumbs(); }).trigger('resize');// 触发初始调整大小 });