Rabu, 22 Juni 2011

MENAMPILKAN GAMBAR ZOOMER DI BLOG

|



Kali ini saya mempostingkan tentang cara memberi efek zoomer pada gambar blog. Memberi efek zoomer. Efek zoomer merupakan efek yang di gunakan untuk menghiasi gambar agar terlihat sedikit menarik. Dengan efek zoomer kita bisa melihat gambar yang ukuran nya kecil diblog. dan juga bisa melihat gambar Cewek lagi bugil untuk di zoom heheheh.........
Okeh langsung aja kita mulai
Lihat contohnya  di bawah ini. SOROT PADA GAMBAR









langsung saja silahkan baca tutorial dibawah ini
Seperti Biasa :
1. login ke akun Blogger anda
2. Masuk Ke Rancangan Elemen Laman
3. Kemudian Tambah Gadget
4. Pilih HTML/Javascript
5. Kemudian copy code dibawah ini


<style type="text/css">

.magnifyarea{ /* Script by www.kikiyo.co.cc Dont Change*/

box-shadow: 5px 5px 7px #818181;

-webkit-box-shadow: 5px 5px 7px #818181;

-moz-box-shadow: 5px 5px 7px #818181;

filter: progid:DXImageTransform.Microsoft.dropShadow(color=#818181, offX=5, offY=5, positive=true);

background: white;

}

</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

<script type="text/javascript" src="http://wwwkikiyococc.googlecode.com/files/featuredimagezoomer.js">

</script>

<script type="text/javascript">

jQuery(document).ready(function($){

$('#image1').addimagezoom({

zoomrange: [3, 10],

magnifiersize: [300,300],

magnifierpos: 'right',

cursorshade: true,

largeimage: 'http://i732.photobucket.com/albums/ww323/satriya_photo/honda-cbr600rr.jpg'

})

$('#image2').addimagezoom({

zoomrange: [5, 5],

magnifiersize: [400,400],

magnifierpos: 'right',

cursorshade: true,

cursorshadecolor: 'pink',

cursorshadeopacity: 0.3,

cursorshadeborder: '1px solid red',

largeimage: 'http://i732.photobucket.com/albums/ww323/satriya_photo/honda-cbr600rr.jpg'

})

$('#image3').addimagezoom()

})

</script>

<p><img id="image1" border="0" src="http://i732.photobucket.com/albums/ww323/satriya_photo/honda-cbr600rr.jpg" style="width:300px;height:225px" /><p></p></p>



Ubah tulisan berwarna biru dengan url gambar anda

6. Simpan.

by: kikiyo

0 komentar:

Posting Komentar

                       

KLIK PADA WARNA DI ATAS DAN LIHAT APA YANG TERJADI

Copyright © 2011 SHARING | BERBAGI

Template N2y Shadow By Nano Yulianto

maafingue

selamat datang di Blog saya, semoga saja kalian bisa mendapatkan apa yang kalian butuhkan diblog saya ini.Dan jangan lupa nge follow blog saya. Terima kasih Telah Berkunjung Di Blog saya,mari kita saling berbagi ilmu tentang apa saja...

About Me

Nama saya SATRIYA TRI PUTRA saya seorang manusia yang ingin sedikit berbagi informasi

Social Stuff

mybloglog twitter facebook HOME
PROFIL