Mam następujący problem:

Mam sobie liste img np:

[HTML] pobierz, plaintext 
<div class="box">
  <div class="inside zdjeciaPoziom">
	    <ul class="zdjecia_pokaz">
        <li>
          <a href="http://yamahafjr.najlepsza.pl/kohana3/www/images/photography/foto/waterfall.jpg" >
            <img alt="waterfall.jpg" src="http://yamahafjr.najlepsza.pl/kohana3/www/images/photography/foto_m/waterfall.jpg"  class="foto_gallery"/>
          </a>
        </li>
        <li>
          <a href="http://yamahafjr.najlepsza.pl/kohana3/www/images/photography/foto/autumn_leaves.jpg" >
            <img alt="autumn_leaves.jpg" src="http://yamahafjr.najlepsza.pl/kohana3/www/images/photography/foto_m/autumn_leaves.jpg" class="foto_gallery" />
          </a>
        </li>
        <li>
          <a href="http://yamahafjr.najlepsza.pl/kohana3/www/images/photography/foto/creek.jpg" >
            <img alt="creek.jpg" src="http://yamahafjr.najlepsza.pl/kohana3/www/images/photography/foto_m/creek.jpg" class="foto_gallery" />
          </a>
        </li>
        <li>
          <a href="http://yamahafjr.najlepsza.pl/kohana3/www/images/photography/foto/desert_landscape.jpg" >
            <img alt="desert_landscape.jpg" src="http://yamahafjr.najlepsza.pl/kohana3/www/images/photography/foto_m/desert_landscape.jpg" class="foto_gallery" />
          </a>
        </li>
	    </ul>    
  </div>
</div>
[HTML] pobierz, plaintext 

I teraz w js poniżej mam:

[PHP] pobierz, plaintext 
widthZdjeciaPoziom = 0;
  $('img.foto_gallery').each(function(){   
      widthZdjeciaPoziom += $(this).attr('width') + 2;      
  });
 
$('.zdjeciaPoziom ul').css('width', widthZdjeciaPoziom);
[PHP] pobierz, plaintext 

Kod ten zlicza mi po załadowaniu zdjęć ich szerokość całkowita plus marginesy i ustawia jak style inline.
Wszystko ok działa - jak odświeżam F5, ctrl+F5 ale się mechanizm źle zlicza jak odświeżę ctrl+F5 - czyli czyszcząc cache przeglądarki dla tej podstrony.
Wówczas nie wiadomo czemu źle się oblicza szerokość i np zamiast 1400 oblicza 416.

Domyślam się że to jest związane z tym że zdjęcia sie wszystkie nie zdążyły załadować a już funkcja sie wykonała. Jednak użycie funkcji $(document).ready(function (){..... tez nic nie dało.

Podpowiedzcie co by trzeba było zrobić - zmienić w tym kodzie by zawsze niezależnie jak odświeżam stronie i ile jest obrazków czy 3, 4, 40 dobrze mi obliczał ta szerokość ogólna.

odpada zupełnie bo to odpala funkcję podaną jako argument po załadowaniu drzewka DOM, gdy obrazki nie są jeszcze załadowane.

Czysty kod odpalany bez zdarzenia odpalany jest wtedy dojdzie do niego parser, a idzie od góry do dołu.

Zdarzenie onload w czystym JS powinno zadziałać, chyba że jQ ma zastępnik tego zdarzenia...

zamiast $(document).ready użyj window.onload = function() Poza tym m.in z takich względów do obrazków ZAWSZE powinno się podawać atrybut width i height

No w sumie pomogło to przy pierwszym odpaleniu strony - juz szerokość sie ok oblicza.
Jednak teraz problem jest z podmiana poprzez ajax.

Ponieważ poniżej tego kodu html mam powiedzmy przycisk ktory podmienia mi zawartosc tego calego ul na nowy z nowymi zdjeciami itd i nawet jesli ponim wywolalem jeszcze raz ta funkcje ustawiajaca szerokosc to nie działa poprawne zliczanie.

Dodałem dla testów na sztywno parametr width do img jednak nic nie pomogło - ponieważ on i tak wówczas musi przejść po each elemencie ul i pododawać sobie. Wiec tutaj i tak to nie dziala jak powinno.

Pokaż jak to robisz, może nie dajesz tej funkcji po ustawieniu readyState == 4?

To jest taki czysto testowy - kod - recznie wprowadzony response - to bedzie generowane i jakies czasem nazwy z du.. ale chodzi o samo działanie.

[PHP] pobierz, plaintext 
<script type="text/javascript">
$('#xxx').live('click', function() {
    $.ajax({
        type: "POST",
        url: "<?php echo ABBPATH;?>/special_controller/ajax/admin_gallery/xxx",
        //data: dane,
        success: function(responseHtml) {
            $(".zdjecia_pokaz").html("<ul class=zdjecia_pokaz><li><a href=http://yamahafjr.najlepsza.pl/kohana3/www/images/photography/foto/waterfall.jpg width=308 ><img alt=waterfall.jpg src=http://yamahafjr.najlepsza.pl/kohana3/www/images/photography/foto_m/waterfall.jpg width=308 class=foto_gallery/></a></li><li><a href=http://yamahafjr.najlepsza.pl/kohana3/www/images/photography/foto/autumn_leaves.jpg ><img alt=autumn_leaves.jpg src=http://yamahafjr.najlepsza.pl/kohana3/www/images/photography/foto_m/autumn_leaves.jpg width=308 class=foto_gallery /></a></li></ul>");
 
            widthZdjeciaPoziom = 0;
            $('img.foto_gallery').each(function(){
                widthZdjeciaPoziom += $(this).attr('width') + 2;
            });
            $('.zdjeciaPoziom ul').css('width', widthZdjeciaPoziom);
 
        }
    });
 
});
 
window.onload = function () {
    widthZdjeciaPoziom = 0;
    $('img.foto_gallery').each(function(){
        widthZdjeciaPoziom += $(this).attr('width') + 2;
    });
    $('.zdjeciaPoziom ul').css('width', widthZdjeciaPoziom);
}
</script>
 
[PHP] pobierz, plaintext 

1) Po co ustawiasz parametr width dla ul?
2) Tak to jest nie używa się cudzysłowiów w parametrach...

[HTML] pobierz, plaintext 
<img width="360" class="foto_gallery" />
[HTML] pobierz, plaintext 

Super działa
wystarczyło faktycznie dorzucic te "" do atrybutów, nawet dziala bez znacnzików width.

Dzięki
Pozdro
Hary