Widget 3 Background With Hover
Hello all! Waktu itu, Mikaila tanya ke aku, cara buat ganti-ganti background. Eits, tapi yang punya aku beda loh. Udah aku edit sendiri, dan ada hovernya. Mau tahu caranyaa? Let's read, guyss!
Kalian ngerti nggak maksudnya Mikaila? Kalo nggak, let's see this capture below!
Langsung aja yaap!
Kalian ngerti nggak maksudnya Mikaila? Kalo nggak, let's see this capture below!
I'm sorry untuk penerangannya.. Dari sananya :') |
- Dasbor > Tata Letak > Add A Gadget > HMTL/Javascript
- Copy this code
<style>#background a img{width:50px;height:50px;display:inline;margin-right:10px;margin-top:0px;border: 2px solid #C4E1FF;}#background a:hover img{border:2px solid #C4E1FF; -moz-border-radius: 35px;
border-radius: 35px;}</style><div id="background"> <script src='http://code.jquery.com/jquery-1.6.2.min.js' type='text/javascript'></script> <script> $(document).ready(function(){ $("#bgcolor1").click(function(){ $("body").css({"background":"url(url bg 1)"}); }); }); $(document).ready(function(){ $("#bgcolor2").click(function(){ $("body").css({"background":"url(url bg 2)"}); }); }); $(document).ready(function(){ $("#bgcolor3").click(function(){ $("body").css({"background":"url(url bg 3)"}); }); }); </script> <div style="text-align:center;"><a href="javascript:void(O)" id='bgcolor1' title="tooltips bg 1"><img alt='tooltips bg 1' src="url bg 1" width="50"height="50" /></a> <a href="javascript:void(O)" id='bgcolor2' title="tooltips bg 2"><img alt='tooltips bg 2' src="url bg 2" width="50" height="50"/></a> <a href="javascript:void(O)" id='bgcolor3' title="tooltips bg 3"><img alt='tooltips bg 3' src="url bg 3" height="50" width="50" /></a></div></div>
- Paste di kolom HTML/Javascript, yaa! Kalo kalian gatau tooltips, bisa lihat capture aku di atas. Lihat tulisan "blue polkadot"? Yang warnanya biru itu loh. Itulah namanya tooltips!
- Save!
- Klik kanan image > Copy image url > Kalo udah mau dipake, klik kanan, paste!
Tiara, kalau untuk yang pakai blogskin gimana ? makasih yaa :)
ReplyDeletedi paste di kode sidebar kamu... :)
Deleteizin copy code dan gambar yaaa
ReplyDelete