MEMBUAT LINK BERGESER APABILA TERKENA CRUSOR MOUSE
Pernahkah anda melihat sebuah list yang menjorok. List ini akan menjorok ke dalam apabila cursor mouse berada disekitar posisi list tersebut. Oke mungkin kalian penasaran apa itu list yang menjorok. Blog Trik dan Tips akan memberikan trik bagaimana membuat list yang menjorok.
Berikut ini adalah langkah untuk membuatnya:
1. Login ke blogger
2. Klik Tata Letak dan Klik Edit HTML
3. Cari kode ini: </b:skin>
4. Paste kode dibawah ini setelah kode pada langkah 3
<script type='text/javascript'>
function lm_toRight(obj) {
obj.marginValBackUp = parseInt(obj.style.marginLeft);
obj.style.marginLeft = (obj.marginBackUp + 5).toString() + "px";
}
function lm_restore(obj) {
obj.style.marginLeft = obj.marginBackUp.toString() + "px";
}
</script>
Keterangan: Anda dapat mengatur seberapa jauh list tersebut menjorok ke dalam dengan mengubah angka kode berwarna merah
5. Untuk membuat list dalam postingan maka jangan lupa untuk memasang atribut ini:
<li onmouseover='lm_toRight(this)' onmouseout='lm_restore(this)'>
6. Jika anda ingin membuat semua list menjorok maka sisipkan kode berwarna biru pada kode di langkah 4, Sehingga hasilnya terlihat seperti di bawah ini, perhatiaka kode biru yang di tambahkan...
<script type='text/javascript'>
function lm_toRight(obj) {
obj.marginValBackUp = parseInt(obj.style.marginLeft);
obj.style.marginLeft = (obj.marginBackUp + 5).toString() + "px";
}
function lm_restore(obj) {
obj.style.marginLeft = obj.marginBackUp.toString() + "px";
}
</script>
function lm_loadBehavior() {
var lis = document.getElementsByTagName("li");
for(var i=0; i < lis.length; i++) {
var li = lis[i];
li.onmouseover = function(){lm_toRight(this);}
li.onmouseout = function(){lm_restore(this);}
}
}
var lm_window_onload = window.onload;
window.onload = function() {
if(lm_window_onload) {lm_window_onload();}
lm_loadBehavior();
}
7. Save dan lihat hasilnya ya...
function lm_toRight(obj) {
obj.marginValBackUp = parseInt(obj.style.marginLeft);
obj.style.marginLeft = (obj.marginBackUp + 5).toString() + "px";
}
function lm_restore(obj) {
obj.style.marginLeft = obj.marginBackUp.toString() + "px";
}
</script>
function lm_loadBehavior() {
var lis = document.getElementsByTagName("li");
for(var i=0; i < lis.length; i++) {
var li = lis[i];
li.onmouseover = function(){lm_toRight(this);}
li.onmouseout = function(){lm_restore(this);}
}
}
var lm_window_onload = window.onload;
window.onload = function() {
if(lm_window_onload) {lm_window_onload();}
lm_loadBehavior();
}
7. Save dan lihat hasilnya ya...