Calcular el ancho total de los niños con jQuery

Question

Jun 19, 2009, 01:12 AM

Calcular el ancho total de los niños con jQuery

He intentado encontrar una respuesta comprensible a esto, pero me he rendido.

Para tenerdinamica contenido (como publicaciones de blog e imágenes) en unasitio web horizontal (al igual que enthehorizontalway.com) debe establecer un ancho fijo para el CUERPO en píxeles, ¿verdad?Debido a que utiliza elementos flotantes en su interior, de lo contrario se rompería y envolvería la página, dependiendo del ancho del navegador.

¡EDITAR! Este valor específico puede sercalculado conjQuery, gracias por eso :) En este ejemplo, se agrega un valor adicional al tamaño total, que se puede usar para el contenido antes de los elementos flotantes. Ahora el cuerpo obtiene un ancho dinámico!

Mi idea inicial era que jQuery nos calculara esto: ('CADA ANCHO DE LAS POSTES' * 'NÚMERO DE POSTALES') + 250 (para el contenido adicional)

Código HTML

<code><body style="width: ;"> <!-- Here we want a DYNAMIC value -->
<div id="container">
    <div id="menu"></div> <!-- Example of extra content before the floats -->
    <div class="post">Lorem</div>
    <div class="post">Lorem</div>
    <div class="post">Lorem</div> <!-- Floated elements that we want the sizes of -->
    <div class="post">Lorem</div>
</div>
...
<!-- So if these posts were 300px exept the last that was 500px wide, then the BODY WIDTH should be ( 300+300+300+500 ) + 250 [#menu] = 1650px -->
</code>

El resultado y la respuesta de Alconja.

<code>$(document).ready(function() {
var width = 0;
$('.post').each(function() {
    width += $(this).outerWidth( true );
});
$('body').css('width', width + 250);
});
</code>

¡Muchas gracias!