Slider Jquery
Langkah Pemasangan1.Log masuk ke blogger dashboard anda
2.Dekat Blogger Dashboard anda-->Klik Design --> Edit Html
Cari kod
]]></b:skin>
Pastekan kod dibawah sebelum/diatas kod ]]></b:skin> tersebut
/*Slider Css*/
#slider{}
#slider ul, #slider li{
margin:0;
padding:0;
list-style:none;
}
#slider li{
width:320px;
height:111px;
overflow:hidden;
}
#prevBtn, #nextBtn{
display:block;
width:30px;
height:77px;
position:absolute;
left:-30px;
top:15px;
}
#nextBtn{
left:320px;
}
#prevBtn a, #nextBtn a{
display:block;
width:30px;
height:77px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi596E4VLXQPmdq5yuywIuEc7qU5hsOxUp5oFQbhv893tUN-ffspLuUoabrdpk5EPfuYKonCMUypzXjkzgbbpzozqKXVvse2khUzb54UoIfxiv8HxezUp9VsFY6CA92_gsd6NHeSRcy-xA/s1600/btn_prev.gif) no-repeat 0 0;
}
#nextBtn a{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDF1u5ECx3HoupuJvxjnL-yBGLFne-Uw9j2zjim0IZVjnQ4DTfMvuxjIG8JJB_7gi4_hEKmLRmMLiN2b-UEiRT6JIAWx1cwDa0XyfWlOPFzXj6UYoG7srXysA8LHcUlF43ocUs4wwZoa0/s1600/btn_next.gif) no-repeat 0 0;
}
/*Slider Css*/
3.Seterusnya cari kod </head>
4.Pastekan kod dibawah sebelum/di atas kod </head>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
<script src='http://suyb.googlecode.com/files/easySlider1.7.js-blogger.js'/>
<script>
$(document).ready(function(){
$("#slider").easySlider({
auto: true,
continuous: true
});
});
</script>
5.Klik save template
6.Akhir sekali,pergi ke layout page atau design-->Add a gadget-->Html Javascript
Pastekan kod dibawah dekat situ
<div id="slider"> <ul>
<li><a href="http://www.fitri1986.blogspot.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS5y2G36QVWwwWHK7kZaUD6nz-zvZb9jMK2fY-zkJjld9Bk29Fn7yzRsGGAwLFfuNxoxQj8MVO2CCsYV4jt61ORqOx7lrAA3Ah1PtLatyB4PEyo3yn1hQnviejrg46kBwDzHxsH6MKz_Q/s320/7.jpg" width="320px" height="111px" /></a></li>
<li><a href="http://www.fitri1986.blogspot.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhePJAbNVjqv-YPrsdmOdA8mPz9OnGLspLbxzs3hY-ObOGy3jP_uTMJQ2LHtbZ0vXoQ2WneqczEpQroAvaN7RC9eVMRCYwy1UBro51jtZQAfVLnx9TcB9G94xMTQsmehNS_c6TEieKqiJM/s320/11.jpg" width="320px" height="111px"/></a></li>
<li><a href="http://www.fitri1986.blogspot.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuAWWsDrAY9woRk03TZjK0UrtpWdvWDZZ-zfVvbx-rQOMDYH2c6LUyikpKh0oMZIE54FYjeRhSrZgJA2ZbNwjRhGpJhJS2IbcY9FWppa8OvIJ6TzkPj4ybU2fZf1ZdWXFM4zb0DZD2SdY/s320/4.jpg" width="320px" height="111px" /></a></li>
<li><a href="http://www.fitri1986.blogspot.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijTKsGVb786OrbPno81zhmErfr23c9NQ0Yndt21LY2pqrwNwUNLYMLtXbObmak0ojOWUwSoA7LWylOQGC0XgTWqYgMrhNZSTR5eRtL4lzGuV9jgm-5RaYZ_rA2R2-mPgAjn6C9SNG4MW8/s320/10.jpg" width="320px" height="111px" /></a></li>
<li><a href="http://www.fitri1986.blogspot.com"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMeksOpKhPa5v97OKMI2T1d67KBPbGo1hOiif-wj_-wtmYIIhXol_kCDsfyaCnUjGlKL-lBXhr0dXptfjmhvENYDONuZ8xofA8ii7aAYAbpTOuzl2bL07uhQD9a3KFNcVwT3FvFTrO0fU/s320/5.jpg" width="320px" height="111px" /></a></li>
</ul>
</div>
*kod merah(untuk gambar) dan hijau(link url)adalah untuk korang tukar.
Post a Comment:
Nota: Hanya ahli blog ini sahaja yang boleh mencatat ulasan.