◄ Min  Size Fonts: + | - | ± Color: Max ►

PicStrips jQuery Plugin Strips Effect to Image

Benar-benar sepi nih resource dari developer. Jadi susah buat update artikel :-s Tema yang tidak akan habis dibahas salah satunya adalah tentang jQuery ;)) Kumpulan trik jquery plugin mungkin sesuatu yg bisa mempertahankan eksistensi dalam aktifitas blogging. Kendalanya ya cuma satu, yaitu susahnya menemukan plugin jQuery yg unik untuk ditemukan :p Koben mau berbagi tutorial plugin jQuery seputar menghias image menjadi putus-putus (PicStrips)
Original title is stylish image bars jquery plugin. Syarat utama agar trick berjalan mulus, di dalam template sudah tertanam script jQuery inti<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>ScreenshotPicStripsGambar akan terlihat terpotong-potong (strips) ujung-ujung image zig-zag dikarenakan penambahan bg color sesuai dengan bg yg ada, strips dapat di customize, tinggi strips ujung gambar dapat di customize dll.
Fancy it?
    unminified, 1.7kb
  • http://www.moreofless.co.uk/downloads/picstrips/picstrips-1.0.js
  • minified, 1.1kb
  • http://www.moreofless.co.uk/downloads/picstrips/picstrips-1.0-min.js
Itu bumbu stylish image bars jquery plugin. Rekomendasi diletakkan sebelum tagging </body> Script pemanggilnya begini
<script type='text/javascript'>//<![CDATA[
  $(document).ready( function() {
    $(".strips").picstrips( {splits: 17,hgutter: '5px',vgutter: '5px',bgcolor: 'rgba(0,0,0,.7)'} );
  });
//]]></script>
Keterangan:
.strips = Unique ID.
<-> splits: 17 = Jumlah strips.
<-> hgutter: '5px' = Jarak strips.
<-> vgutter: '5px' = Tinggi ujung strips (zig-zag effect) pada image.
<-> bgcolor: 'rgba(0,0,0,.7)' = Warna latar belakang vgutter
Sobat dapat menambahkan varian strips dengan memasukan ke dalam script pemanggilnya! Contoh:<script type='text/javascript'>//<![CDATA[
$(document).ready( function() {
$(".strips").picstrips( {splits: 17,hgutter: '5px',vgutter: '5px',bgcolor: 'rgba(0,0,0,.7)'} );
$("#strips2").picstrips( {splits: 3,hgutter: '10px',vgutter: '40px'} );
$("#strips3").picstrips( {splits: 18,hgutter: '2px',vgutter: '10px', bgcolor: '#fff'} );
});
//]]></script>
Demo & resource by: www.moreofless.co.uk/picstrips
Happy jQuery \m/
Loading...
XPicStrips jQuery Plugin Strips Effect to Image
PicStrips adalah jQuery plugin untuk menambahkan sedikit gaya pada gambar. Kita dapat membagi gambar ke sejumlah strip, tentukan spasi antara setiap strip dan juga jumlah vertikal spasi ditambahkan di bagian atas dan bawah strip alternatif.
Subscribe my posts Register For Free!
[?] g+ convert

DO NOT EVEN TRY ADD LINK [-X
You can use some HTML tags, such as
<b> - <i> - <a> - http://...jpg/gif/png/bmp - http://youtu.be/...


MISC

Resources

WANT BE HERE!!! CONTACT ME :P

FACEBOOK PAGE