Cara Membuat Logo Blog Berkilau Saat Disentuh Pointer

15:03:00
Cara Membuat Logo Blog Berkilau Saat Disentuh Pointer

Selamat datang agan atau aganwati kali ini saya akan berbagi tips blogging yaitu tentang cara membuat logo blog berkilau saat disentuh pointer, sebagai tutorial silakan simak di bawah ini;


Langkah

1. Login pada blog anda masing-masing,

2. Pada menu dashboard blog, pilih menu edit template,

3. Setelah itu cari kode </b:skin> dengan cara
Ctrl
+
F
,


4. Setelah itu copy script di bawah ini lalu paste tepat di atas kode </b:skin>,

 .spanning {z-index: 9999;display: block;position: absolute;background: url("http://4.bp.blogspot.com/-vyNT11VOT4Q/VAKp8n9oEtI/AAAAAAAADtU/kIEbA9m6bmg/s800/shine.png") -300px 0px no-repeat;transition-property: all;transition-duration: .8s;-webkit-transition-property: all;-webkit-transition-duration: .8s;background-size: 100%;height: 55px;width: 249px;bottom:0;}
.logo a:hover .spanning{background-position: 300px 0px;} 

Pada tag .logo di sesuaikan dengan tag logo blog anda mungkin di setiap blog mempunyai tag logo yang berbeda.

Untuk tag logo ubah dengan class atau id pada tag div logo blog anda, jika id berarti menjadi pagar # dan jika class tetap titik.


Contoh untuk tag logo class :

CSS     : .logo a:hover .spanning{background-position: 300px 0px;}
HTML : <div class='logo'>
<a href='/'><span class='spanning'/><img alt='Renaldy Ways' src='http://4.bp.blogspot.com/-bOEPG7hbq9g/VmgHOo5ZgCI/AAAAAAAACic/X4vrAmkQpgI/s1600/LogoNew.png'/></a>
</div>

Pada tag div logo menggunakan class, jadi .logo tetap titik / tidak berubah!



Contoh untuk tag logo id :

CSS     : #logo a:hover .spanning{background-position: 300px 0px;}
HTML : <div id ='logo'>
<a href='/'><span class='spanning'/><img alt='Renaldy Ways' src='http://4.bp.blogspot.com/-bOEPG7hbq9g/VmgHOo5ZgCI/AAAAAAAACic/X4vrAmkQpgI/s1600/LogoNew.png'/></a>
</div>

Pada tag div logo menggunakan id, jadi .logo diubah menjadi #logo!




5. Setelah itu cari div tag logo blog anda, setelah itu selipkan script di bawah ini pada div tag logo blog anda seperti di bawah ini,

 <span class='spanning'/> 


diselipkan pada div tag logo blog anda seperti ini,
Cara Membuat Logo Blog Berkilau Saat Disentuh Pointer


6. Simpan lalu lihat hasilnya.





Nah itu saja dari saya semoga bermanfaat, jangan lupa bagikan serta tinggalkan komentar anda, terima kasih.


Referensi www.idblanter.com/2015/07/membuat-logo-berkilau-saat-disentuh-cursor.html

Share this

I'm CEO & Founder in http://caritema.com & http://renaldyways.blogspot.com/


Artikel Menarik Lainnya

Artikel Selanjutnya
Next Post
Artikel Sebelumnya
Previous Post
Cara style text di komentar Disqus dan Blogger:
  • Untuk menulis huruf bold silahkan gunakan <strong></strong> atau <b></b>.
  • Untuk menulis huruf italic silahkan gunakan <em></em> atau <i></i>.
  • Untuk menulis huruf underline silahkan gunakan <u></u>.
  • Untuk menulis huruf strikethrought silahkan gunakan <strike></strike>.
  • Untuk menulis kode HTML silahkan gunakan <code></code> atau <pre></pre> atau <pre><code></code></pre>, dan silahkan parse dulu kodenya pada kotak parser di bawah ini.
  • Untuk menggunakan emoji di bawah ini cukup copy kode tersebut dan beri jarak 1 spasi untuk menampilkan emoji pada kolom komentar Blogger.
Parser Kode
FAQ
Emotikon

Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger
Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

0 Comments