Tahun baru, skill baru! 🚀. Masukkan kupon "skill2025" untuk diskon 30% di kelas apa saja

Membuat image background berubah sesuai waktu yg telah ditentukan

Untuk membuat image background berubah/berganti dengan otomatis sesuai waktu yg sudah ditentukan seperti apa caranya?

avatar Wilder
@Wilder

1 Kontribusi 0 Poin

Diperbarui 4 tahun yang lalu

1 Jawaban:

coba pakai logika javascript ini, silahkan di perindah, ini hanya logikanya saja,

<pre> &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;

&lt;style&gt;

div.tembusPandang { margin: 30px; background-color: #ffffff; border: 1px solid black; opacity: 0.5; /* berikut utk IE yang tua */ filter: alpha(opacity=60); }

div.tembusPandang p { margin: 5%; font-size:40px; font-weight: bold; color: #000000; align: center; } &lt;/style&gt;

&lt;script type="text/javascript"&gt; var gambarNya=['gambar1.jpg','gambar2.jpg','gambar3.jpg','gambar4.jpg']; var tunjukGambar=0; //mulai dari gambar pertama setInterval(function(){ tunjukGambar+=1; //ganti gambarnya if(tunjukGambar==4){ //berapa jumlah gambar tunjukGambar=0; //kembali lagi ke gambar pertama } document.body.style.backgroundImage = 'url('+gambarNya[tunjukGambar]+')'; document.body.style.backgroundRepeat = "no-repeat"; },5000); //kecepatan ganti gambar

&amp;lt;/script&amp;gt;

&lt;/head&gt; &lt;body&gt;

&lt;div class="tembusPandang" align = "center"&gt;&lt;p&gt;Ini contoh Content di div tembus pandang&lt;br&gt; silahkan tambahkan sesuai kebutuhan&lt;/p&gt; &lt;/div&gt;

&lt;/body&gt;

&lt;/html&gt; </pre>

avatar VikSintus
@VikSintus

96 Kontribusi 36 Poin

Dipost 4 tahun yang lalu

Login untuk ikut Jawaban