Xx+==x(EXPLORATION)Xx==+==x

Home » Tips Blogger » Chainable Effects With Jquery

Chainable Effects With Jquery

Caranya adalah sebagai berikut :

1. Login ke Akun Blogger anda masing-masing.
2. Klik Design or Rancangan, kemudian pilih Edit HTML
3. Centang (Expand Widget Template)
4. Untuk keamanan lebih baik kita (Download Template Lengkap)
5. Gunakan (Ctrl+F) or (Alt+E+F) untuk memudahkan pencarian
6. Cari kode ]]></b:skin>
7. Dan Simpan kode berikut diatasnya :

/* ---------------
Chainable effects with jquery
---------------------------------- */
#box {
   background: #6699FF;
   height: 100px;
   width: 100px;
   position: relative;
}

8. selanjutnya simpan script berikut tepat diatas </head>:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

   $(".run").click(function(){

       $("#box").animate({opacity: "0.1", left: "+=400"}, 1200)
       .animate({opacity: "0.4", top: "+=160", height: "20", width: "20"}, "slow")
       .animate({opacity: "1", left: "0", height: "100", width: "100"}, "slow")
       .animate({top: "0"}, "fast")
       .slideUp()
       .slideDown("slow")
       return false;

   });

});
</script>