Effect Isi Posts Ketika Gambar di Sorot

Ketika cursor mouse diarahkan pada picture / gambar, maka secara otomatis akan tampil isi posting dari gambar tersebut!. Itulah judul dari tulisan kali ini.

Untuk lebih memahami maksudnya, silahkan sobat lihat tampilan posting seperti judul diatas pada tulisan I Like Effect

Inilah tips singkat cara pengolahannya pada blog :

Pertama, masuk ke ruang editor HTML Template blog
Kedua, Copy paste script berikut ini dan letakkan tepat diatas kode ]]></b:skin>

#onhotext {
width: 100%;
height: 133px;
color: transparent !important;
font-size: 13px;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}
#onhotext:hover {
color: #575858 !important;
}
#onhotext img{
float: left;
margin: 0 15px;
#onhotext p {text-transform: uppercase; font-weight:bold;}
}

Simpan Template Sobat!


Selanjutnya, buat tulisan pada Entri Baru (kotak posting) anda seperti contoh dibawah ini

<div id="onhotext"><a href="http://www.flickr.com/photos/stg_gr1/5197829578/" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://farm5.static.flickr.com/4126/5197829578_49fde0383e.jpg" /></a><p>JUDUL BLOG</p>Belajar Membuat Effect Post Ketika Gambar di Sorot menggunakan cursor mouse.<br />
</div>

Ganti Url gambar (script yang bercetak miring  diatas)
JUDUL BLOG = ganti dengan judul yang anda inginkan
Isi tulisan = Ganti sesuai tulisan yang anda mau.

Sekarang tinggal lihat hasilnya.



Share on :

0 komentar:

 
© Copyright Berbagi Inspirasi Seputar Dunia Blogger 2011 - Some rights reserved | Powered by Blogger.com.
Template Design by Herdiansyah Hamzah | Published by Borneo Templates and Theme4all