Background change when cursor click

Assalamualaikum :)

hello... tuto hari ini buat benda macam ni yang special... super special.... coba klik gambar-gambar di atas navbar ku, klo di klik... TADAAA!!! akan berubah backgroundnyaaa.... hari ini freee... yaudah luna buat ^_^v

Template Designer

1. design > layout > add a gadget > html/javascript

2. copy dan pastekan code di bawah ni:

<style type="text/css">
#bagie a img{
width:50px;
height:50px;
display:inline;
margin-right:10px;
margin-top:15px;
border: 2px solid #EEE;
}
#bagie a:hover img{
border: 2px solid #bdebff;
}
</style>
<script type="text/javascript">
<div id="bagie">
<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 GAMBAR 1)"});
            });
});
$(document).ready(function(){
            $("#bgcolor2").click(function(){
                        $("body").css({"background":"url(URL GAMBAR 2)"});
            });
});
$(document).ready(function(){
            $("#bgcolor3").click(function(){
                        $("body").css({"background":"url(URL GAMBAR 3)"});
            });
});
</script>

<center><a href="javascript:void(O)" id='bgcolor1' title="AYAT ANDA"><img src="URL GAMBAR 1" /></a>
<a href="javascript:void(O)" id='bgcolor2' title="AYAT ANDA "><img src="URL GAMBAR 2" /></a>
<a href="javascript:void(O)" id='bgcolor3' title=" AYAT ANDA"><img src=" URL GAMBAR 3" /></a></center></div>
</div>

3. preview and save!


note!

color red : tukar dengan link background anda pastikan hanya 3 jenis background saja.

Share? mohon taro ini di blogmu, dan izin aku dulu kalau mau share

Tidak jadi? tolong kasih tau aku di comment

Credit: Rara