使用jQuery计算Children的总宽度
我试过找到一个可以理解的答案，但放弃了。
为了在横向网站 （如thehorizontalway.com ）上拥有dymnamic内容（如博客文章和图片），你必须为像素中的BODY设置一个固定的宽度，对吧？ 因为你在其中使用浮动元素，否则会破坏和包裹页面，具体取决于浏览器的宽度。
编辑！ 这个特定的值可以用jQuery 计算 ，多亏了:)在这个例子中，一个额外的值被添加到总大小，可以用于浮动元素之前的内容。 现在身体得到了动态的宽度！
我最初的想法是让jQuery为我们计算：（’每个post宽度’*’号码数’）+ 250（额外内容）
HTML代码
Lorem Lorem Lorem Lorem ... Alconja的结果和答案
$(document).ready(function() { var width = 0; $('.post').each(function() { width += $(this).outerWidth( true ); }); $('body').css('width', width + 250); });
非常感谢！
看起来你已经非常正确……但是有两点注意事项：
-
.outerWidth(true)包括填充和边距（因为你传递的是true），所以没有必要再尝试添加它。 -
.outerWidth(...)仅返回第一个元素的宽度，因此如果每个元素的大小不同，则将其乘以post数将不是总宽度的准确值。
考虑到这一点，这样的东西会给你你想要的东西（保持你的250初始填充，我假设是菜单和东西？）：
var width = 0; $('.post').each(function() { width += $(this).outerWidth( true ); }); $('body').css('width', width + 250);
这有帮助吗，或者你有其他一些具体问题（你的问题不是很清楚）？
你可以用这个单线计算宽度，虽然比我想要的要长一点。
var width = $('.post').map(function(undefined, elem) { return $(elem).outerWidth(true); }).toArray().reduce(function(prev, curr) { return prev + curr; }, 0);