MOHON PERHATIAN!!!........ Sehubungan sedang "ERROR"nya situs HTTP://WWW.RIPWAY.COM, maka bila Anda menemukan tutorial yang menggunakan kode dengan nama situs tersebut, sementara waktu JANGANLAH Anda gunakan. Mohon maaf, semoga anda memakluminya.............................

Mengucapkan Selamat Datang, Semoga Dapat Berkenan Di Hati Anda


SYAMSUDINNAMAKU telah hadir

Cara Membuat Efek Image Shadow Hover


Maksud dari tutorial ini adalah membuat efek bayangan
pada image atau gambar yang ada di dalam area posting-
an maupun di sidebar. Efek tersebut akan bekerja mana-
kala cursor anda diletakkan di atas gambarnya.
Contohnya seperti pada gambar di bawah ini :



Apabila anda ingin membuatnya, ikuti langkah
caranya seperti berikut ini :


CARA PERTAMA :

1.   Rancangan -> Tambah Gadget ->
      Pilih HTML/JavaScript

2.   Letakkan kode berikut di dalam kontennya :

3.   Atau masukkan langsung dalam area posting anda.

<style type='text/css'>.syam img:hover{-webkit-box-shadow:3px 3px 5px 5px; -moz-box-shadow:3px 3px 5px 5px red;)</style>

<a class="syam" href="#syam"><img src="URL image disini" /></a>

KETERANGAN =

Ganti warna shadownya ( red ) dengan
warna yang anda inginkan.

Aturlah ukuran lebar shadownya pada kode
3px 3px 5px 5px & 3px 3px 5px 5px

Masukkan URL image anda pada kode
URL image disini

CARA KEDUA :

1.   Masuk -> Edit HTML

2.   Carilah kode </b:skin>

3.   Copy kode berikut dan letakkan kode
      tersebut di atas kode </b:skin> ini.

.syam:hover img {-webkit-box-shadow:3px 3px 5px 5px; -moz-box-shadow:3px 3px 5px 5px red;}

KETERANGAN =

Ganti warna shadownya ( red ) dengan
warna yang anda inginkan.

Aturlah ukuran lebarnya shadow pada kode
3px 3px 5px 5px & 3px 3px 5px 5px

Kode penggunaan di postingan / di sidebarnya :

<a class="syam" href="#syam"><img src="URL image disini" /></a>

KETERANGAN =

Masukkan URL image anda pada kode
URL image disini

Selamat mencoba, good luck!


0 comments:

Poskan Komentar