Membuat Elemen Hide N Seek

Selasa, 11 Agustus 2009

Yang aku maksud dengan elemen hide n seek adalah jika pointer mouse kita berada di atas sebuah post/artikel maka elemen tersebut akan terlihat, dan jika pointer mouse kita berada di tempat lain, elemen tersebut tidak akan terlihat. Hal ini membuat elemen tersebut lebih menarik untuk dilihat pembaca.
Aku terinspirasi membuat ini dari facebook. Semoga saja pemilihan nama "hide n seek" tidak salah. :)
Contohnya kamu bisa lihat di blog ini.

Cara membuatnya:

  1. Masuk ke account Blogger kamu, pilih "Layout" - "Edit HTML",
  2. Centang "Expand Widget Templates",
  3. Cari kode
    .post {
    xxxxxxxxxxxx
    xxxxxxxxxxxx
    ...
    }
    kemudian tambahkan di bawahnya:
    .post .hideseek {
    display:none;
    }
    .post:hover .hideseek {
    display:inline;
    float:right;
    }
  4. Nah, setelah itu, cari lagi kode <div class='post-footer'>, dan tambahkan di bawahnya:
    <div class='hideseek'>
    <!-- Kode Elemen kamu di sini -->
    </div>
  5. Kamu bisa menambahkan kode elemen di atas dengan kode Share Button, sebuah gambar, dll.
  6. Kalau kamu mau menambahkannya dengan gambar, ganti saja kode yang ditebalkan dengan
    <img src='urlgambarkamu.png'/>
Selamat mencoba!
Bagi yang ingin bertanya atau mempunyai masalah dalam mencoba ini, silakan tinggalkan komentar di bawah :D

Blog this!

Suka artikel dari blog ini? Silakan masukkan alamat email kamu untuk mendapatkan artikel terbaru dari Info Blog. Gratis!!
Atau baca Feed dari blog ini di sini.

Delivered by FeedBurner

76 komentar:

sigit mengatakan...

yang ini contohnya yang mana mas...masih bingung kalau belum ada contohnya..

wisnu mengatakan...

betul!!
contoh plis..!!!

Copycat91 mengatakan...

kalau kamu mau buat readmore sebagai elemen hide n seek, kamu tulis aja
<a expr:href='data:post.url'> Read More </a>
di bagian "Edit HTML" di "Layout" blog kamu

Copycat91 mengatakan...

O iya, contohnya kamu bisa lihat kalau kamu ada di halaman utama blog ini, akan terlihat elemen yang kadang muncul, kadang tidak..

blog buat bloggers mengatakan...

wow keren sob
saya baru tahu materiartikel ini

thank's sob

nice blog

Ikhwanul muslim mengatakan...

kok articelnya nga ke singkat..??

BHENAYA ORGANIZER mengatakan...

Saya belum bisa membuat'nya ....:(

MaRLiF mengatakan...

iya nich...saya juga masih bingung... maklum newbie.

nowGoogle.com adalah Multiple Search Engine Popular mengatakan...

berkunjung kembali lagi

Festival Museum Nusantara mengatakan...

mampir sob

Health Spot mengatakan...

mantab gan

Health Spot mengatakan...

mantab gan

Piala Dunia 2010 mengatakan...

keren bro

Forantum I Blogging is My Life I Tutorial Blog I Tips dan Trik Blog I SEO I Free Template mengatakan...

Makasih sobat....

ieyChiey mengatakan...

thnks yaa..cute^^

BlazeHack mengatakan...

oh yeah, you don't follow my blog

Hayu Nur Mahron / BlazeHack mengatakan...

oh yeah, you don't follow my blog .salam blogger http://www.blaze-hack.co.cc

TakeoGoun mengatakan...

Kalo buat tombol hide n seek tapi buat scrool halaman ke atas gmn ya ??

Anonim mengatakan...

Kok nggak bisa, bos??
Nggak ada kode yang ini:

.post {
xxxxxxxxxxxx
xxxxxxxxxxxx
...
}

STMIK AMIKOM menuju Research University mengatakan...

sundul gan !

Baraq mengatakan...

mantab lah... try first!!!!

Baraq mengatakan...

http://koranonlen.blogspot.com/

Head Of Hacker mengatakan...

hebatt bisa nih...

bankaskep mengatakan...

mas kode HTMLnya kok ga ketemu....?
Bantuin dong....?

nurulate mengatakan...

mas gag da kode htmlnyaa.. gimana donk??

s4ndmotion mengatakan...

mantabs infonya....thx

BLOGBEGO mengatakan...

salam kenal dulu kawan,
nice info - mantap - dicoba ya and trims

whiplash blog mengatakan...

It is very rare these days to find blogs that provide information someone is looking for. I am glad to see that your blog share valued information that can help to many readers. Thanks and keep writing.

what is an iva mengatakan...

Thanks for sharing the code. It works for me easily.

whiplash compensation claims mengatakan...

This is really a chance for me to learn about this matter.

apex credit mengatakan...

By doing this, having this kind of a worthy website I think you will probably rank higher in the search engines.

Kang Aziz mengatakan...

cari kodenya dimana pak...

debt management company mengatakan...

Your post really helps me to work easily.

debt management company mengatakan...

This blog is going to be great resource. Love reading it.

Anonim mengatakan...

There are certainly a lot of details like that to take into consideration. All are good pints to consider for. I now consider the thoughts above as general inspiration.

Interface Talent Network FL

robinson way debt collectors mengatakan...

I’ve had a quick look at your site, it looks very interesting. Maybe you’d like to send a synopsis through for us to publish for you? Please make it as factual as possible and include a short bio of yourself and a link to your site at the end.

Anonim mengatakan...

This can be a greatest post with this subject I've ever examine. We are genuinely really satisfied from it. Retain writing a blog!

homemade mayonnaise

Ozi R2 mengatakan...

hidup cuma sekali. mari kita hiasi dengan sesuatu yang berarti dengan di mulai belajar dan belajar sampai mati... ok ayo semangat belajar

battery tester mengatakan...

Thank you regarding talking over this matter. We concur together with your findings. The particular factors how the files stated are typical upfront in genuine encounters even help much more.

pain management New Jersey mengatakan...

It is such an honor to have the chance to join the discussion of this great blog site! I want to extend my thanks for this.

scottsdale 3M Di-Noc mengatakan...

I truly liked taking a look at by way of your publish!. Leading high quality compound. I could advise you to arrive up with blogposts even far more usually. scottsdale 3M Di-Noc

Steve Waters Vancouver mengatakan...

I genuinely liked reading through your post! You have quality material. I might advise you to come up with blog posts even more often. By doing this, having this kind of a worthy website I think you will probably rank higher in the search engines.

fashion pr nyc mengatakan...

Nice information really helpful share I also try it and amazingly its start work I am very happy to create my own twitter widget thanks dude for sharing.

mercedes lease deals oh mengatakan...

I am happy to find this post very useful for me, as it contains lot of information. I always prefer to read the quality content and this thing I found in you post. Thanks for sharing!

scottsdale 3M Di-Noc mengatakan...

Intimately, the article is really the most effective on that worthwhile concept. I in form in using your conclusions and surely will eagerly seem forward for your subsequent updates. Just stating numerous many thanks are not able to basically be sufficient, for your fantastic clarity within your composing.

Edmonton moving company mengatakan...

I came across this kind of as a possible informational information along with intriguing, i really think that is incredibly valuable and well-informed for me. I must thanks for the actual efforts they've designed to write this particular very good write-up. If at all possible, when you obtain knowledge, would you thoughts upgrading your website with additional information? It is rather of great help for myself.

Anodized Aluminum Cookware mengatakan...

I’m not much into reading, but somehow I got to read many articles in your webpage.
It’s fantastic how interesting it is for me to visit you very often.

obat diabetes melitus mengatakan...

coba di buat saja deh

obat kanker payudara mengatakan...

sukses ya gan

best 42 inch led tv mengatakan...

I acquire some important subjects in here which have the ability to not be observed in any sort of web sites. Thanks for sharing this weblog. I love it.

obat alternatif glaukoma mengatakan...

di buat kan deh gan moga aja bisa :d

obat alternatif penyakit gondok mengatakan...

di buat kan saja gan hahaha

obat alternatif diabetes melitus mengatakan...

apa nih gan kaya nya kurang jelas nih info nyua :D

west jordan optometrist mengatakan...

That is certainly an awfully unbelievable column which have posted. Thanks a great deal for that fantastically amazing report!

Umweltfonds mengatakan...

saya mau tanya. tadi sebelum saya ganti template blog saqya masih biasa2 saja. tapi setelah itu page element, dan layout hilang

Telescoping Ladders mengatakan...

I appreciate you offering us all so great write-up. I will read more in your blog post as it help always.

Clarence H. mengatakan...

I will definitely happen to be dropping by this web pages more frequently for I am very intrigue with the topic that definitely catches my pastime.

Supercoolzz | Blog Berbagi Informasi mengatakan...

mantap

Artikel Komputer Menarik mengatakan...

saya sering liat nih yang kaya gini di website-website orang.. ternyata begni cara buatnya..

topSpot | Find your top spot here mengatakan...

Thanks buat tutorialnya! Walaupun saya belum jelas cara penggunaan nya di html, tapi tpp, nice post deh :)

Colley & Colley, LLP - Austin mengatakan...

The post is written in very a good manner and it entails many useful information for me. I am happy to find your distinguished way of writing the post. Now you make it easy for me to understand and implement the concept. Thank you for the post.

write sample college essays mengatakan...

It goes on to clarify that it means virtue because this is concerned with emotions and actions and the meaning in these is praised and constitutes success. The majority have almost no doubt that such material could be of a some interest. Needless to be modest if someone lays open to public sample college essays that are skilled and talented at the same time.

Anonim mengatakan...

ӏ am not posіtіνe wherе you're getting your information, however great topic. I must spend a while studying more or working out more. Thank you for excellent information I was looking for this information for my mission.

Also visit my webpage - how to create a website using html

Anonim mengatakan...

Ι wanted to thank you for this gοоd read!
! I аbsolutеly loved evеry
little bіt of it. I have yοu bookmarked tο
check out nеω stuff you pоst…

Feel freе to surf to my page: een website bouwen

Perbedaan Windows 32 Bit dan 64 Bit mengatakan...

Perlu di coba gan, kelihatannya mantap

Blogadexme mengatakan...

tq sudah berbagi.

Blog Musik Mp3 Lagu Terbaru mengatakan...

saya mw coba di Blog dummy dlu

cara dapat uang dari youtube mengatakan...

makasih gan infonya bermanfaat..
salam mas brow

Jual Frame Kacamata mengatakan...

Waah.. tampilannya baru ya..

medicenter wordpress theme mengatakan...

Medicenter wordpress theme is good

cara menjaga kesehatan ginjal mengatakan...

kunjungi kami gan

Situspoker88.com mengatakan...

Situs Agen Judi Poker dan Domino Online Terpercaya Indonesia
AGEN POKER DAN DOMINO TERBAIK DI INDONESIA
AGEN POKER DAN DOMINO ONLINE TERBAIK DI INDONESIA
AGEN DOMINO99 DAN POKER ONLINE TERBESAR DI ASIA
Agen Judi Poker Domino QQ Ceme Online Indonesia
Referensi Judi Poker Domino QQ Ceme Online Indonesia
AGEN POKER DAN DOMINO ONLINE TERBAIK DI INDONESIA

Makasih Gan :)

shinchanpoker.com mengatakan...

REJEKIPOKER AGEN POKER DAN DOMINO ONLINE TERBAIK DI INDONESIA
SITUSPOKER88.COM Kumpulan situs poker domino terlengkap
Situs Judi Poker Online dan Domino Online Indonesia Terpercaya
SHINCHANPOKER AGEN POKER DAN DOMINO TERBAIK DI INDONESIA
MIYABIPOKER AGEN POKER DAN DOMINO ONLINE TERBAIK DI INDONESIA
ABADIPOKER.COM SITUS AGEN POKER DOMINO CAPSA DAN ADUQ ONLINE TERPERCAYA INDONESIA

diah wulandari mengatakan...

Terima kasih gan untuk infonya, sangat bermanfaat...

H2H PLN Murah
Pulsa H2H Murah
Saldo Vtri Murah
Software Pulsa
Software Roket Pulsa

dewa poker mengatakan...

Bagus sekali blog-nya, Terus berkarya Gan...!!

Poker Online
Agen Poker Online
PokerV
Poker uang Asli

Agen Poker online mengatakan...

Bagus sekali blog-nya, Terus berkarya Gan...!!

Poker Online
Agen Poker Online
PokerV
Poker uang Asli

Poskan Komentar

Silakan berkomentar di bawah ini. You comment, I follow.
Tapi komentar yang bernada spam akan saya hapus. Terima kasih :D

Cheat di Blog

Rainbow Text

Buku Tamu versi 2


ShoutMix chat widget
Widget by Info Blog

Headline News

Buku Tamu


ShoutMix chat widget

Mau punya buku tamu seperti ini?
Klik di sini (Info Blog)

Tautan Link Otomatis

Gamba di Pojok