Home
Guestbook
About
Message
FeedfadeBGImages adalah jQuery plugin sederhana yang dirancang khusus untuk merubah background gambar di website Anda setiap detik sesuai kebutuhan. menggunakan HTML <span></span> yang dipadu dengan css background-image() property memungkinkan background gambar yang Anda gunakan dapat menyesuaikan lebar dan tinggi pada layar perangkat.
Syntax:
$("#selector").fadeBGImages({source:['source.jpg', 'images.jpg'], transition:3000, interval:5000, easing:"linear"});
Arguments:
| Key | Type | Default | Description |
|---|---|---|---|
| source | Array | - | [Dibutuhkan] Sumber gambar yang akan dijadikan background |
| transition | Integer | 3000 | [Opsional] Waktu yang dibutuhkan untuk melakukan pergantian gambar (dalam satuan milisecond) |
| interval | Integer | 5000 | [Opsional] Jeda gambar sebelum diganti oleh gambar lain (dalam satuan milisecond) |
| easing | String | linear | [Opsional] Gaya yang diberikan ketika background sedang terjadi pergantian. Daftar easing dapat Anda lihat disini |
Cara pemasangan plugin fadeBGImages secara utuh dapat Anda lihat pada contoh di bawah ini:
<html>
<head>
<title>Simple Random Background With fadeBGImages</title>
<script type="text/javascript" src="//code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="//cb4me.gq/assets/js/plugin/fadeBGImages.js"></script>
<script type="text/javascript">
$("document").ready(function() {
var images= ['/img/sumber.jpg', '/img/gambar.jpg', '/img/anda.jpg', '/img/disini.jpg'];
$("#wrapper").fadeBGImages({source:images, transition:3000, interval:5000, easing:"swing"}); });
</script>
</head>
<body>
<div id="wrapper"></div>
<!-- konten utama situs anda -->
</body>
</head>
Walaupun menggunakan plugin fadeBGImages dapat menyebabkan website Anda ganteng maksimal, tapi cobalah untuk mempertimbangkan kembali dalam pemilihan gambar yang sesuai secara ukuran dan resolusi. Supaya website Anda tetap dapat bekerja secara maksimal.
