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!

I'm sorry untuk penerangannya.. Dari sananya :')
Langsung aja yaap!

  • 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!
Good luck, guys! Url image bisa kalian dapatkan dengan cara:

  • Klik kanan image > Copy image url > Kalo udah mau dipake, klik kanan, paste!
Byeee~~

Comments

Post a Comment

- Komentar harus yang sopan dan baik ya
- Jangan bertengkar di kolom komentar
- Kalau repost kasih namaku dan link blogku
- Terima kasih sudah mematuhi. Silahkan berkomentar ^^

Popular posts from this blog

Resensi Novel Surprise in Hokkaido

Rindu

Teenager World