Showing posts with label membesar. Show all posts
Showing posts with label membesar. Show all posts
Friday, December 2, 2016
Cara Membuat Gambar Membesar Saat Disorot Pointer Mouse
Cara Membuat Gambar Membesar Saat Disorot Pointer Mouse
[parwito-file]:Nah kawan kawan semua untuk kali ini saya ingin mencoba berbagi trik bagaimana Cara Membuat Gambar Membesar Saat Disorot Pointer Mouse, sangatlah simple caranya yaitu dengan cukup memasang kode di bawah ini bersama kode css yang lain.
<style type=text/css>
.post .post-body img:hover{-o-transition:all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform:scale(1.2); -o-transform:scale(1.2); -webkit-transform:scale(1.2);}
</style>
Jika teman-teman ingin membuat efek seperti ini hanya ada pada halaman posting, silahkan ganti kode diatas dengan kode di bawah ini.
<b:if cond=data:blog.pageType == "item">
<style type=text/css>
.post .post-body img:hover{-o-transition:all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform:scale(1.2); -o-transform:scale(1.2); -webkit-transform:scale(1.2);}
</style>
</b:if>
Bagaimana cara pasangnya :
1. Masuk blogger dahulu
2. ke Template kemudia edit HTML --> Proses
3. Cari kode </head> dengan cara CRTL + F
4. Taruh kode tadi diatas kode </head>
5. Simpan
Contoh Gambar , soroti dengan MOuse untuk cek :
Go to link Download
Saturday, October 29, 2016
Cara Membuat Link Membesar Saat disentuh Kursor
Cara Membuat Link Membesar Saat disentuh Kursor
Tutorial kali ini tentang trik atau cara untuk membuat blog menjadi lebih menarik. "Membuat Link Membesar Saat disentuh Kursor". Maksudnya link yang pada saat dilintasi cursor mouse akan menjadi besar tulisannya, Selain cara ini Anda juga bisa Membuat Gambar Membesar Saat disentuh Cursor, Membuat Link Berkedip Saat Disentuh Cursor, Membuat Link Berwarna Warni, dan lain-lain.
Buat Sobat yang ingin memasang trik ini silakan ikuti tutorial dibawah ini.
Cara Membuat Link Membesar Saat disentuh Kursor :
- Masuk ke akun blogger sobat.
- Pilih Template > Edit HTML.
- Ceklis / Centang Expand Widget Template.
- Cari kode a:hover {
- Ganti kode font-size dengan ukuran yang lebih besar.
Contoh :a:hover {ganti dengan
color:#d2691e;
font-size:10px;
font-style:italic;
cursor:wait;
}a:hover {
color:#d2691e;
font-size:19px;
font-style:italic;
cursor:wait;
} - Terakhir klik Simpan Template.
Selamat Mencoba dan Semoga Bermanfaat...
Go to link Download
Monday, October 24, 2016
Cara Membuat Gambar Membesar Saat disentuh Cursor
Cara Membuat Gambar Membesar Saat disentuh Cursor
Mungkin sebagian Blogger sering melihat gambar yang menjadi besar apabila tersentuh cursor. Dalam dunia blogging fitur seperti ini sering disebut dengan nama Image Zoom Effects atau Hover Zoom Smooth Effects. Fitur yang satu ini lumayan banyak di senangi para blogger walaupun sebenarnya dengan memasang Image Zoom Effects ini di blog dapat menggangu pengunjung yang sedang membaca postingan kita.
Postingan ini saya buat untuk melengkapi Tutorial di blog ini, buat sobat yang ingin memasangnya silakan Anda ikuti tutorial dibawah ini.
Cara Membuat Gambar Membesar Saat disentuh Cursor :
- Masuk ke akun blogger sobat.
- Pilih Template > Edit HTML.
- Ceklis / Centang Expand Widget Template.
- Cari kode ]]></b:skin> , gunakan fungsi Find dengan menekan tombol CTRL+F pada keyboard.
- Kalau sudah ketemu, letakkan kode berikut tepat di atas kode ]]></b:skin>.post img, table.tr-caption-container { border:none; max-width:560px; height:auto; -o-transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; }
.post img:hover { -o-transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform: scale(1.5); -o-transform: scale(1.5); -webkit-transform: scale(1.5); -webkit-border-radius: 0px 0px; -moz-border-radius: 0px / 0px; -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6); } - Terakhir klik Simpan Template. Sekarang lihat hasilnya di blog Sobat.
Semoga tutorial singkat ini bisa bermanfaat...
Go to link Download
Friday, October 14, 2016
Cara Membuat Gambar Di Blog Membesar Ketika Di Sorot Menggunakan JavaScript
Cara Membuat Gambar Di Blog Membesar Ketika Di Sorot Menggunakan JavaScript
Assalamualaikum wr.wb para pembaca sekalian, pada kesempatan kali ini saya akan membagikan cara tentang cara membuat gambar yang ada pada blog kita membesar tetapi tanpa menghalangi tulisan yang sedang di baca oleh si pembaca, jadi mereka tetap bisa enjoy baca artikel blog kita dan juga tanpa membuat blog kita terlalu berat... kalo contohnya sudah ada di samping :]...nah cara membuatnya mudah, cukup COPAS kode berikut di postingan anda atau di tempat lain
<script src="http://zamalsblog.googlecode.com/files/Zoom%20Image.js" type="text/javascript"></script>keterangan:
<img border="0" class="expando" height="90" src="ISI DENGAN URL GAMBAR YANG KAMU INGINKAN" width="130" />
biru = ukuran tinggi gambar, bisa di ganti sesuai selera
Merah = Ganti dengan link gambar yang akan kalian buat zoom
Kuning = ukuran lebar gambar, bisa di ganti sesuai selera
lalu simpan
selesai....
ya mungkin sekian dari saya assalamualaikum wr. wb dan
-Semoga Bermanfaat(^^,)-
Go to link Download
Subscribe to:
Posts (Atom)