Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS][JavaScript][PHP] Zmiana background-image co kilka sekund
-Alex00101-
post
Post #1





Goście
Witam,
Mam kod który zmienia tło strony co 3 sekundy, jednak chcę uzyskać efekt delikatnego przejścia z jednego tła w drugie. Obecnie jest to gwałtowny przeskok z jednego zdjęcia w drugie.

[PHP] pobierz, plaintext 
  1. <script type="text/javascript">
  2.  
  3. window.addEventListener('load', function () {
  4.     var tla = ['url(foto1.jpg)', 'url(foto2.jpg)'];
  5.     var czas = 3; // 3 sekundy
  6.  
  7.     var i = 0;
  8.     setInterval(function () {
  9.         i++;
  10.         i%=tla.length;
  11.  
  12.         document.body.style.backgroundImage = tla[i];
  13.     }, czas * 10000);
  14. }, false);
  15. </script>
  16.  
[PHP] pobierz, plaintext


Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
kipero
post
Post #2





Grupa: Zarejestrowani
Postów: 233
Pomógł: 50
Dołączył: 28.10.2006
Skąd: Radom

Ostrzeżenie: (0%)
-----

Wydaje mi się, że najprościej będzie stworzyć div, który będzie pokrywał cały dokument. Chodzi mi o coś takiego:
Kod
<body>
<div id="bg">
... właściwa treść ...
</div>
</body>


Zamiast podmieniać tło dla body będziesz mógł ustawić dla #bg opacity na 0, ustawić jego tło, stopniowo zwiększać opacity, a na koniec ustawić to samo tło dla body i zacząć cały proces od nowa. Mam nadzieję, że w miarę jasno to opisałem.
Go to the top of the page
+Quote Post

Posty w temacie
- Alex00101   [CSS][JavaScript][PHP] Zmiana background-image co kilka sekund   8.06.2013, 16:19:09
- - SmokAnalog   Musisz wstawić dwa divy z tłem lub dwa obrazki, je...   8.06.2013, 16:25:58
- - kipero   Wydaje mi się, że najprościej będzie stworzyć div,...   8.06.2013, 16:26:38
- - SmokAnalog   A w ogóle to najlepiej skorzystać z gotowych skryp...   8.06.2013, 16:28:36

« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Przełącz na: Linearny+ · Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 25.05.2026 - 04:49
Powered By IP.Board © 2026  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn