Question

我给容器#page-wrap宽度，它是使用此代码组合其中所有图像宽度的宽度：

HTML

<div id="page-wrap" class="group">
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
        <article class="post">
            <?php the_post_thumbnail('large'); ?>
        </article>
    <?php endwhile; endif; ?>
</div>

JS

    var windowH = $(window).height();
    var windowW = $(window).width();

    if (windowW >= 751 && $('article img').length) { 
        $('article img').height(windowH -190); 
        $('article img').css('width', 'auto');
        var allArticleWidth = 0;
        $('article').each(function() {
            allArticleWidth += $(this).width() + 10; //10 is margin of post
        });
        $('#page-wrap').width(allArticleWidth); 
    }

但是当窗户垂直时，它不起作用; #page-wrap的宽度小于应该的宽度。

Answer 1

感谢Gren Duncan，我开始关注样式表中的内容，发现我使用的基础框架附带了img的max-width：100％。因此，jQuery以某种方式获得图像的css最大宽度，该宽度不能宽于窗口宽度，而不是实际输出的图像宽度。我删除了max-width，因为我不需要它，它解决了这个问题。

jQuery each和width（）不起作用

1 个答案: