Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Ładowanie obrazka
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
zleek
19.01.2007, 23:13:57
Mam następujący kod na stronie:

[HTML] pobierz, plaintext 
  1. <img id='foto' onload="preload('obrazek.jpg');" src='obrazek_tymczasowy.gif' />
[HTML] pobierz, plaintext


Mam też zdefiniowaną funkcję preload, która po pełnym wczytaniu pliku obrazek.jpg powinna mi podmienić "obrazek_tymczasowy.gif" obrazkiem "obrazek.jpg".

[HTML] pobierz, plaintext 
  1. function preload(obr)
  2. 	{
  3. 	var img=new Image();
  4.         img.src=obr;
  5.         document.getElementById(foto).src=img.src;	
  6. 	}
[HTML] pobierz, plaintext


No i wszystko działa ładnie. Najpierw wyświetla "obrazek_tymczasowy.gif", później - po wczytaniu - wyświetla "obrazek.jpg", ale tu pojawia się problem, ponieważ cały czas wczytuje obrazek.jpg i nie przestaje się wykonywać akcja związana z onload worriedsmiley.gif

Nie za bardzo wiem, jak rozwiązać ten problem. Jeżeli ktoś z Was zna sposób na jego rozwiązanie lub całkiem alternatywną metodę podejścia do tego problemu - będę wdzięczny za pomoc.
ferr
20.01.2007, 12:07:08
Mozliwe, ze dalszy kod Ci cos pieprzy, nie wiem. Sprobuj tego:

[HTML] pobierz, plaintext 
  1. function preload(obr)
  2. 	{
  3. 	var img=new Image();
  4.         img.src=obr;
  5.         document.getElementById('foto').src=img.src;
  6. return true;	
  7. 	}
[HTML] pobierz, plaintext
zleek
22.01.2007, 11:36:00
probowalem juz dodawac return true do funkcji ale nie pomaga

po prostu zachowuje sie tak jakby po podmianie obrazka, czyli

[HTML] pobierz, plaintext 
  1. document.getElementById(foto).src=img.src;
[HTML] pobierz, plaintext


znow wywolywalo event onLoad i wszystko od nowa - i tak w około :/
revyag
22.01.2007, 14:11:21
Wygląda mi to na zapętlenie. Po prostu zdarzenie onload jest wywoływane za każdym razem jak załaduje się obrazek.jpg.
Użyj innej metody preloadu obrazków.
gekon
28.01.2007, 03:42:14
a return false; probowales?
k0b3
3.02.2007, 01:49:23
hej... mam identyczny problem, a probowalem co piszecie i chyba sprawa nie zostala jeszcze rozwiazana..

Prosze... co dalej zrobic? Tak samo zapetla mi...
lopik
3.02.2007, 14:59:00
Ale wydaje mi się że zdarzenie onload="" jest tylko dla <body>

A funkcja do zmiany obrazka może być np. taka:

Kod
function preload(obr, ide)
{
    var img = new Image();
    var newSrc = img.src = obr;
    var elm = document.getElementById(ide);
          elm.setAttribute('src', newSrc);
}

[HTML] pobierz, plaintext 
  1. <img id="zmien" onclick="pre('zamien.png', this.id)" src="obrazek.png" />
[HTML] pobierz, plaintext
k0b3
3.02.2007, 15:32:43
Znalazlem motyw na stronie autora tego tematu:

http://www.tulikowski.com/?id=9 -> chciałbym coś w tym stylu jak ładują się te miniaturki..
lopik
3.02.2007, 15:35:11
To popatrz w kod, i poczytaj o AJAX'ie.
Lub poproś autora ww. strony o kod winksmiley.jpg
Joy-machine
4.02.2007, 11:18:49
Zrobiłeś rekurencję, która ma szanse zadziałać ale musisz dodać:
- warunek stopu (gdy skończą się obrazki),
- opóźnienie ładowania kolejnego obrazka, setTimeout,

ogólnie wrzucanie onLoad do obrazka to troszkę brzydki sposób, ładniej jest zrobić zewnętrzny skrypt który dobierze się do tych obrazków, będzie ładował nowe z opóźnieniem. Jeżeli nie dasz rady to chyba lepiej ściągnij... gotowiec sad.gif Co do ajaxa to tez można, ale to troszkę zbyt trywialny skrypt żeby ładować ajax.
k0b3
8.02.2007, 19:58:42
Miałby ktoś coś takiego gotowego... Sorki, ale naszukałem się na forum i ogólnie w necie to sa kolosalne skrypty...

Bardzo prosze, niech ktoś napisze rozwiazanie.. Z java jestem troche kiepski.. ;-)

Hej nikt nie ma takiego skryptu w swoich zbiorach biggrin.gif

smile.gif
gekon
8.02.2007, 20:12:28
Zamiast do onload obrazka daj do onload okna (window.onload), Joy-machine już to sugerował.
k0b3
8.02.2007, 20:42:32
eh.. niezauwazylem tego...
w nagłówku strony http://www.tulikowski.com/
<script type="text/javascript" src="galery.js"></script>
-> http://www.tulikowski.com/galery.js

jest tam skrypt:

[HTML] pobierz, plaintext 
  1. var xmlHttp=createXmlHttpRequestObject();
  2. var i;
  3. var zaladowany = new Array();
  4.  
  5.  
  6. //funkcje odpowiedzialne za wstepne zaladowanie grafiki
  7. function preload(obr, nr)
  8. 	{			
  9. 	var pole= "foto_" + nr;
  10. 	var plik= "http://www.tulikowski.com/"+obr;
  11. 	var plik2="http://tulikowski.com/"+obr;
  12. 	if(document.getElementById(pole))
  13. 		{	
  14. 		if(document.getElementById(pole).src=="http://www.tulikowski.com/img/w.gif" || document.getElementById(pole).src=="http://tulikowski.com/img/w.gif")
  15. 			{
  16. 			zaladowany[nr]="1";
  17. 			loadImage(obr, nr);
  18. 			}
  19. 		}
  20. 	return false;				
  21. 	}
  22.  
  23. function loadImage(obr, nr)
  24. 	{
  25.  
  26. 	var pole= "foto_" + nr;
  27. 	var img=new Image();
  28.     img.src=obr;
  29.     document.getElementById(pole).src=img.src;	
  30.     if(document.getElementById("loading"))
  31.     	setTimeout("document.getElementById('loading').style.visibility='hidden'", 2500);
  32. 	}	
  33. //koniec funkcji
[HTML] pobierz, plaintext


to chyba o to chodzi...
jak daje:

<img id="foto_0" src="jakis tam obrazek.jpg" onload="preload('jakis tam obrazek.jpg', 0);" /> - nie uruchamia sie.

Moze teraz jasniej... co mam zrobic?
gekon
8.02.2007, 22:15:20
Zamiast w obrazku, daj pod deklaracją swoich funkcji w nagłówku:

[HTML] pobierz, plaintext 
  1. window.onload = function(){
  2.  preload('jakis tam obrazek.jpg', 0);
  3. ...
  4. }
[HTML] pobierz, plaintext
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.