Cara membuat Slide Jquery

1. Masuk ke blogger
2. Klik Rancangan >> Klik Edit HTML
3. Cari kode  ]]></b:skin>; Lalu copy pastekan kode dibawah ini tepat diatasnya

/* Coin Slider jQuery plugin CSS styles http://workshop.rs/projects/coin-slider */ .coin-slider { overflow: hidden; zoom: 1; position: relative; } .coin-slider a{ text-decoration: none; outline: none; border: none; } .cs-buttons { font-size: 0px; padding: 10px; float: left; } .cs-buttons a { margin-left: 5px; height: 10px; width: 10px; float: left; border: 1px solid #B8C4CF; color: #B8C4CF; text-indent: -1000px; } .cs-active { background-color: #B8C4CF; color: #FFFFFF; } .cs-title { width: 563px; padding: 10px; background-color: #000000; color: #FFFFFF; } .cs-prev, .cs-next { background-color: #000000; color: #FFFFFF; padding: 0px 10px; } 

4. Copy pastekan kode dibawah ini tepat diatas kode  </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/> <script src='http://mrmung.googlecode.com/files/coin-slider.min.js' type='text/javascript'/> <script type='text/javascript'> $(document).ready(function() { $(&#39;#coin-slider&#39;).coinslider({ width: 563, navigation: false, delay: 5000 }); }); </script>

 Nb. 563 ganti sesuaikan (lebar)

5. Klik simpan
6. Klik ke Elemen halaman untuk menambah widget.,Copy paste kode script dibawah ini

<div id='coin-slider'>

<a href="ALAMAT-URL" target="_blank">
        <img src="URL -GAMBAR gambar" />
        <span>
    Deskripsi gambar......
        </span>
    </a>
 
<a href="ALAMAT_url" target="_blank">
        <img src="URL-gambar" />
        <span>
    Deskripsi gambar......
        </span>
    </a>

<a href="ALAMAT_url" target="_blank">
        <img src="URL- gambar" />
        <span>
    Deskripsi gambar ......
        </span>
    </a>

</div>

 Nb.Ganti alamat url dengan alamat URL anda

7. Simpan dan geser sesuai yang anda kehendaki posisinya.


sumber** click here

Posted in: Artikel,Tema