Minggu, 23 Mei 2010

Efek Perbesaran Gambar

Sebelumnya saya ucapkan turut berduka cita atas wafatnya Gesang dan Hj. Ainun Habibie. Semoga mereka diterima amal baiknya dan semoga keluarga yang ditinggalkan diberi ketabahan oleh Yang Maha Kuasa. Amin...

Pada postingan seminggu yang lalu kita membahas tentang efek redup-terang untuk gambar. Nah, kita juga akan membahas tentang efek gambar disini. Tetapi, efek gambar kali ini adalah ketika kursor mouse melintas di atas gambar tersebut maka gambar tersebut akan membesar. Biasanya ini sangat cocok untuk gambar yang berukuran 125x125. Contohnya seperti pada gambar di atas. Yang kiri adalah kondisi gambar pada saat biasa dan yang kanan adalah kondisi gambar pada saat kursor mouse melayang diatas gambar tersebut.

Sekedar catatan, tekhnik ini menggunakan CSS3 jadi tidak akan bekerja di Internet Explorer.

Langsung sajaa!!!

1. Login ke Blogger, lalu seperti biasa, klik Tata Letak > Edit HTML.

2. Backup template anda.

3. Cari kode ]]></b:skin>, lalu taruh kode berikut diatasnya.
.besar:hover{
-moz-transform:scale(1.25);
-webkit-transform:scale(1.25);
}
4. Kalau sudah, klik Simpan Template.

Untuk memasukkannya ke blog, pilih Tata Letak > Elemen Halaman > Tambah Gadget > HTML/Javascript. Lalu pada bagian isi ketikkan kode berikut.
<a href="LINKYANGDIINGINKAN"><img src="URLGAMBAR" class="besar"/></a>
LINKYANGDIINGINKAN adalah link yang diinginkan, sedangkan URLGAMBAR adalah URL dari gambar.

Anda juga bisa meletakkannya di pastingan anda. Pada mode Edit HTML tentunya. Semoga bermanfaat.


Apabila anda menyukai postingan ini, anda bisa men-sharenya ke yang lain. Semisal ke Facebook atau Twitter. Silakan klik salah satu pilihan dibawah.

Buzz It

Artikel Menarik Lainnya



10 komentar:

Yopi. B mengatakan...

mantaf sob langsung berhasil...thank's

belajar internet mengatakan...

mantap sob,,,boleh juga tu buat blogku yang lain,,

thanks

iklan gratis mengatakan...

Thanks bro atas infonya.. ;)

camera mengatakan...

makasih infonya....

Koje mengatakan...

okay Mas... ntar dicuba...
ni pake WordPress :)
http://ekos06.student.ipb.ac.id

Blogger Templates Colorizetemplates.com mengatakan...

makasii maz atas infonya.
baru tahu nich.
hehehe

Travel Jakarta Bandung mengatakan...

yipi, jd tambah besar n jelas, gambar2 dblog ku... makasih infonya.

puluthriau mengatakan...

di ie bisa gak?

Kolom Blog Gratis mengatakan...

thanks infonya bermanfaat,...

poker mengatakan...

poker online | Agen Domino | Agen Poker|Kumpulan Poker | bandar poker | Judi Poker | bandar qiu | Judi online terpercaya

Posting Komentar

Apa pandapat anda terhadap artikel ini? Berkomentarlah tanpa rasa malu, ragu dan takut.

Komentar diluar tanggung jawab pemilik blog. Jika anda berkomentar yang berbau pornografi atau sara, maka itu risiko anda sendiri.

Jika anda mengirimkan komentar spam, maka akan saya hapus.

Jika anda tidak ingin komentar anda ditampilkan, silakan kirimkan e-mail di halaman email me.

Jika anda ingin berceloteh bebas, silakan tuju halaman ini.

Anda dapat menggunakan beberapa tag HTML seperti <b>, <i>, <u>, <a>, <strike>, <sub>, <sup>, dan lain-lain. Anda juga dapat menggunakan emoticon Plurk seperti (lmao) (taser) (haha).

Untuk link exchange bisa dilakukan dihalaman ini, sedangkan banner exchange dihalaman ini. Permintaan link exchange dan banner exchange selain dihalaman tersebut tidak akan dilayani.



Emoticon yang dapat digunakan [Tampilkan] [Sembunyikan]



:-))
:-)
:-D
(lol)
:-p
(woot)
;-)
:-o
X-(
:-(
:'-(
:-&
(K)
(angry)
(annoyed)
(wave) | (bye)
B-)
(cozy)
(sick)
(:
(goodluck)
(griltongue)
(mmm)
(hungry)
(music)
(tears)
(tongue)
(unsure)
(highfive)
(dance)
(blush)
(bigeyes)
(funkydance)
(idiot)
(lonely)
(scenic)
(hassle)
(panic)
(okok)
(yahoo)
(cry)
(doh)
(brokenheart)
(drinking)
(girlkiss)
(rofl)
(money)
(rock)
(nottalking)
(party)
(sleeping)
(thinking)
(bringit)
(worship)
(applause)
8-)
(gym)
(heart)
(devil)
(lmao)
(banana_cool)
(banana_rock)
(evilgrin)
(headspin)
(heart_beat)
(ninja)
(haha)
(evilsmirk)
(eyeroll)
(muhaha)
(taser) | (rammi)
(banana_ninja)
(beer)
(coffee)
(fish_hit)
(muscle)
(smileydance)
(fireworks)
(goal)
(bzzz)
(dance_bzz)
(Русский)
(code)
(morning)

Cara menggunakan: ketikkan emoticon yang diinginkan. Untuk yang ada pemisah berupa "|" maka itu adalah alternatif. Seperti (wave) | (bye) maka bisa (wave) bisa (bye)


Pengikut

Follow via NetworkedBlogs



Jangan lupa jadi fans Muhammad Rizki Fadillah's Blog di Facebook. Klik link di bawah ini.

http://www.facebook.com/pages/Tips-Trik-Matematika-Tutorial-Blogging-Muhammad-Rizki-Fadillahs-Blog/277782561876

Setelah mengklik link diatas, klik tombol Become A Fan untuk menjadi fans Muhammad Rizki Fadillah's Blog.