Event Handler onMouseOver & onMouseOut

Apakah Anda tahu apa itu Event Handler onMouseOver & onMouseOut? Guna dari event ini adalah untuk mengatur apa yang akan terjadi saat mouse digerakkan pada suatu objek misalnya: gambar. Untuk membuat gambar yang bisa berubah saat didekati mouse caranya sangat mudah.

Langkah-langkahnya sebagai berikut:

1. Login account blogger.

2. Pilih Layout kemudian klik pada tab Page Elements.

3. Setelah itu Klik Add a Gadget  dan pilih Html/javascript.

4. Tulis script sederhana  di bawah ini.

 <a href="http://juliocaesarz.blogspot.com/" onmouseover="document.gambarku.src=
'http://juliocaesarz.blogspot.com/gambar1.gif'" 
onmouseout="document.gambarku.src=
'http://juliocaesarz.blogspot.com/gambar2.gif'" >
<img border="0" src="http://juliocaesarz.blogspot.com/gambar2.gif" name="gambarku"/></a>

Tampilannya:



Keterangan:

• Ganti href dengan alamat blog anda.

• Ganti tulisan berwarna merah pada gambar, dengan alamat url gambar yang diinginkan.

• Pada gambar1.gif dan gambar2.gif gunakan gambar yang berbeda.
  

Baca Selanjutnya »

Membuat Read More di Blogspot

Langkah-langkahnya

• Login ke account blogger anda, kemudian klik link Layout dan pilih pada Edit HTML
• Jangan lupa untuk membackup Template Anda dengan cara klik pada Download template dan simpan. Kemudian centang(cek) Expand Templates Widget untuk mengedit template secara keseluruhan.
• Masukkan kode berikut sebelum tag </head> atau tepat sesudah kode } ]]></b:skin>seperti dibawah ini :
<style> <b:if cond='data:blog.pageType == "item"'> span.fullpost {display:inline;} <b:else/> span.fullpost {display:none;} </b:if> </style>
• Selanjutnya untuk mengatur agar postingan terpotong, cari kode <p><data:post.body/></p> dalam template anda dan tambahkan kode berikut tepat dibawahnya:
<b:if cond='data:blog.pageType != "item"'> <a expr:href='data:post.url'> Read More..</a> </b:if>
• Supaya postingan terpotong, setiap kali anda menulis artikel pada posting, klik pada bagian artikel dimana anda ingin tulisan Read More.. muncul, lalu ketik <span class=”fullpost”> kemudian lanjutkan sisa artikel sampai selesai, akhiri dengan mengetik </span>. Untuk menmbahkan kode ini, ketika menulis artikel, anda harus dalam mode Edit HTML bukan Compose

Baca Selanjutnya »