Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Dodanie onload dla każdego zdjęcia
Forum PHP.pl > Forum > Po stronie przeglądarki
Matrix12
Witam,



mam taki problem. Chce aby dla każdego zdjęcia w dokumencie był dodany znacznik onload który wywołuje funkcje ajaxową która zwraca dla niego odpowiednie elementy html. Problem w tym że na mozilli zdjęcie się ładuje i onload wywołuje funkcje ajaxową. Jednak na chromie zdjęcie niby ma onload ale tych elementów nie ładuje... Wydaje mi się że zdjęcie za wczesnie się ładuje a dopiero wtedy jest mu dodany znacznik onload..
Teraz mam to zrobione tak:




$(document).ready(function(){
$(img).load().each(function(){
var pic = $(this).attr("id");
$(this).attr({"onload": "showMarker("+pic+")});
});
});




Próbowałem z $(window).load(); ale to też nie daje rady.. po prostu musze wczytać znaczniki zanim zdjęcie się załaduje.. macie jakieś pomysły jak to zrobić?
qbas-s
w konsoli masz jakieś błędy?
nie wiem czy tylko tu się pomyliłeś ale to
$(img)
powinno być
$("img")

plik z tym js'em spróbuj wczytać przed </body>
Matrix12
Nie odpisałem "" ale w prawdziwym kodzie to mam. Problem w tym że ten kod muszę wywolać w body.. innego wyjścia nie mam. A problem z tym że onload nie działa w chromie
qbas-s
po co Ci load()?

wystarczy samo $('img').each
Matrix12
Okej ale to i tak nic nie daje. próbowałem wszelkich sposóbów. Problem leży w tym , że artykuł jest z TINY MCE i finalnie zdjęcia wychodza bez żadnej klasy i żadnego id.. Ja w document.ready muszę nadać im klasy id, kontenery które ich odaczają i dodać im onload by po załadowaniu zdjęcie opaliło funkcje i wczytało sobie dodatki poprzez ajax.. na mozilli działa to, wydaje mi się że znacznik onload jest dodany wczesniej niż finalnie img znajdzie się w dokumencie.. i jak zdjęcie się załaduje to odpala onload.. natomiast w chrome chyba jest tak że zdjecie się załadowałow tedy dopiero dodaje mu sie onload a onload nie opali bo zdj jest już załadowane...
qbas-s
Konsolo coś Ci wyrzuca?
Opóźnienie w przypadku jquery nie powinno mieć miejsca - zapewnia Ci to deklaracja $(document).ready - czyli jeśli dokument zostanie załadowany dopiero do akcji wchodzi jquery
viking
Tylko pewnie obrazki są dynamicznie dodawane więc w momencie ready nie istnieją w DOM. Albo problem z cache http://stackoverflow.com/questions/3877027...image-is-cached
Comandeer
Obrazki nie łapią się na $(document).ready, bo to zasób wczytywany PO DOM. Tutaj łapie je jedynie load okna.

Poza tym problemy z wczytywaniem obrazków znane są nie od dziś: https://github.com/desandro/imagesloaded
qbas-s
Cytat(Comandeer @ 26.08.2015, 13:12:41 ) *
Obrazki nie łapią się na $(document).ready, bo to zasób wczytywany PO DOM. Tutaj łapie je jedynie load okna.


a to nie jest tak, że nie łapie się tylko atrybut src, natomiast znacznik img jest normalnie wczytywany?
Malukaz
wrzuc gdzies i daj link szybka piłka
Comandeer
@qbas-s ale ja nie mówię o znaczniku tylko o obrazku wink.gif Tak, znacznik img jest normalnie parsowany i jego [src] jest wrzucane na listę wczytywanych zasobów. Dodać do tego limit jednoczesnych połączeń w browserach i mamy odpowiedź na pytanie czemu obrazki są doczytywane po sparsowaniu i przemieleniu całego DOM.
qbas-s
Cytat(Comandeer @ 26.08.2015, 18:07:17 ) *
Tak, znacznik img jest normalnie parsowany i jego [src] jest wrzucane na listę wczytywanych zasobów.


faktycznie - zawartość atrybutu src jest w tym przypadku istotna bo jakiś marker ma się tam pojawiać

rozwiązaniem mogłoby być ładowanie zawartości do src za pomocą ajax'a - wtedy po wypełnieniu src moglibyśmy dla danego elementu zastosować zapewne trochę zmodyfikowaną funkcję showMarker.

Oczywiście może być to jakieś rozwiązanie jeśli nie zależy nam na indeksowaniu tych grafik w google
Pyton_000
a to
$('img').ready()
nie złapie załadowania obrazka?
Comandeer
Nie, bo to łapie wczytanie samego DOM (zdarzenie DOMContentLoaded)
Pyton_000
Fakt. Zajrzałem bo pamiętałem że gdzieś to widziałem.
Miałem gdzies u siebie cos takiego:

Kod
$('img').one('load', function()
        {
            console.log('Image Ready');
        });


I działało to nawet smile.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.