Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][JavaScript]Zmiana obrazków po upływie czasu
Forum PHP.pl > Forum > Przedszkole
-miras666-
9.05.2013, 20:49:22
Witam. Na stronie znajdują się dwa obrazki. Aktualnie, po upływie 1 sekundy obrazek "1.jpg" zmienia się na "2.jpg". Chciałbym dodać możliwość, aby także drugi plik zmieniał się na inny ("3.jpg" na "4.jpg"). Jednak nie wiem jak się za to wziąć. Z góry dziękuję.
[HTML] pobierz, plaintext 
  1. <html><head>
  2. <meta http-equiv="content-type" content="text/html; charset=ISO-8859-2">
  3.  
  4. <script type="text/javascript">
  5. setTimeout ( "ZmianaObrazka()", 1000 );
  6. function ZmianaObrazka ( )
  7. {
  8.  
  9. if(document.getElementById("imgid").src="1.jpg") {
  10.   document.getElementById("imgid").src="2.jpg";
  11.   setTimeout ( "ZmianaObrazka()", 1000 );
  12.  
  13.  
  14. }
  15. }
  16.  
  17.  
  18. </script>
  19.  
  20. <img  src="1.jpg" id="imgid" />
  21. <br>
  22. <img  src="3.jpg" id="imgid" />
  23.  
  24. </body></html>
[HTML] pobierz, plaintext
Mega_88
9.05.2013, 21:03:00
Nadaj inne id dla obrazka 3 i powtórz funkcję zmiany dla obrazka 3 na 4 

[HTML] pobierz, plaintext 
  1. <script type="text/javascript">
  2. setTimeout ( "ZmianaObrazka()", 1000 );
  3. function ZmianaObrazka ( )
  4. {
  5. if(document.getElementById("imgid_druga").src="3.jpg") {
  6.   document.getElementById("imgid_druga").src="4.jpg";
  7.   setTimeout ( "ZmianaObrazka()", 1000 );
  8. }
  9. }
  10. </script>
  11. <img  src="3.jpg" id="imgid_druga" />
[HTML] pobierz, plaintext


Możesz też to zrobić w jednej funkcji.
-miras666-
9.05.2013, 21:11:13
Coś takiego działa. Dzięki wielkie
[HTML] pobierz, plaintext 
  1. <html><head>
  2. <meta http-equiv="content-type" content="text/html; charset=ISO-8859-2">
  3.  
  4. <script type="text/javascript">
  5. setTimeout ( "ZmianaObrazka()", 1000 );
  6. function ZmianaObrazka ( )
  7. {
  8.  
  9. if(document.getElementById("imgid").src="1.jpg") {
  10.   document.getElementById("imgid").src="2.jpg";
  11.   setTimeout ( "ZmianaObrazka()", 1000 );
  12.  
  13.  
  14. }
  15. }
  16. setTimeout ( "ZmianaObrazka2()", 1000 );
  17. function ZmianaObrazka2 ( )
  18. {
  19.  
  20. if(document.getElementById("imgid_druga").src="3.jpg") {
  21.   document.getElementById("imgid_druga").src="4.jpg";
  22.   setTimeout ( "ZmianaObrazka()", 1000 );
  23.  
  24.  
  25. }
  26. }
  27.  
  28.  
  29.  
  30. </script>
  31.  
  32. <img  src="1.jpg" id="imgid" />
  33. <br>
  34. <img  src="3.jpg" id="imgid_druga" />
  35.  
  36.  
  37.  
  38. </body></html>
[HTML] pobierz, plaintext
Mega_88
9.05.2013, 21:16:47
Powodzenia dalej 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.