Cara Membuat Website Dengan Background Slide Show Menggunakan Jquery

Pernahkah kalian melihat website dengan background slide show atau background bergerak dengan slider, nah kali ini saya akan mencoba memberikan tips dan trik Cara Membuat Website Dengan Background Slide Show Menggunakan Jquery. Pada studi case kali ini kita akan membuat sebuah website sederhana dengan background slide show, bisa teman – teman lihat pada screen shoot nya di bawah ini yang nanti kita akan buat

Oke mari langsung kita praktekkan, seperti biasa siapkan text editornya dan copy script html nya di bawah ini

<!DOCTYPE html>
<html lang="en" class="no-js">
	<head>
		<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
		<title>Cara Membuat Website Dengan Background Slide Show Menggunakan Jquery</title>
	</head>
	<body>
		<div class="container">
			<header>
				<h1>Dumet School</h1>
			</header>	
			<menu>
				<ul>
					<li><a href="">Home</a></li>
					<li><a href="">Galerry</a></li>
					<li><a href="">Contact</a></li>
					<li><a href="">About</a></li>
				</ul>
			</menu>	
			<div class="main">
				<ul id="cbp-bislideshow" class="cbp-bislideshow">
					<li><img src="images/7.jpg" alt="image01"/></li>
					<li><img src="images/8.jpg" alt="image02"/></li>
					<li><img src="images/9.jpg" alt="image03"/></li>
					<li><img src="images/10.jpg" alt="image04"/></li>
					<li><img src="images/11.jpg" alt="image05"/></li>
					<li><img src="images/12.jpg" alt="image06"/></li>
				</ul>
			</div>

		</div>
   </body>
</html>

Save dengan nama index.html, untuk image teman – teman bisa gunakan gambar apa saja asalkan gambarnya tidak pecah dan aturlah image nya terlebih dahulu dengan ukuran 1024 x 628px. Langkah berikutnya kita tambahkan style css nya dan Jquery nya, teman – teman bisa download pada link ini

Langkah berikutnya kita implementasikan Cara Membuat Website Dengan Background Slide Show Menggunakan Jquery, paggil masing – masing sesuai namanya css dan Jquery nya.

Seperti yang kalian lihat pada gambar di atas yang saya beri kotak berwarna merah, adalah untuk memanggil css dan jquery nya yang tadi sudah teman – teman download. Jika sudah di panggil link nya, baru kita berikan script pada gambar di bawah ini untuk mengaktifkan slidernya

Jika sudah, save dan jalankan pada browser nya. Maka membuat website dengan background sudah berhasil di buat

Bagaimana, sangat mudah bukan..??

Baik, sekian pada artikel kali ini tentang Cara Membuat Website Dengan Background Slide Show Menggunakan Jquery. Kita berjumpa kembali pada artikel berikutnya, semoga bermanfaat.

Terima Kasih dan Sampai Jumpa.

Cara Membuat Website Dengan Background Slide Show Menggunakan Jquery

Kategori