Chainable effects with jquery

Cara membuatnya :
1. Login blogger
2. Rancangan, Edit Html, Cari kode ]]></b:skin>
3. Dan Simpan kode berikut diatasnya :

 

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

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>

simpan template...

untuk cara pemanggilannya, pada posting, gadget, atau dimanapun yang kawan-kawan inginkan :

<p><a href="#" class="run">Run</a></p>
<div id="box">Content Here
</div