delay:1000

distance:40

UI Resizable Animate, Duration & Easing

$('img').resizable({helper:"garis-bantu", animate:true, animateDuration:1000, animateEasing:"easeOutElastic"});

UI Slider - Menggabungkan Semuanya

Berat Badan Anda?

UI Slider - Orientasi Vertikal

$('#slider').slider({orientation:"vertical", range:"min"}).height(420);

UI Slider - Manipulasi Nilai Minimal dan Maksimal

.slider({range:"min", value:30});

.slider({range:"max", value:30});

Default

Dengan Step

.slider({value:30});

Lorem ipsum dolor sit amet-amet jabang bayi oek-oek. Consectetur kampuang nan jauh dimato ambo-ambo tempe goreng enak rasanya. Sed diam nonumy ummy-ummy eirmod tempor kuch-kuch hota hai. Mere-mere mereketehe ut labore et dolore magna aliquyam alhamdulillah. Ut labore et dolore magna calcilua cit silit pitik. Vivanius et labore et quis lacinia quam ante eu mah didie pahlawan bertopeng. Encing enyak babeh ayuh semua nonton tipi kite. Mauris mauris ante meridiem blandit suscipit eros. Vivamus nisi metus meletus brot. Lorem ipsum dolor sit amet-amet jabang bayi oek-oek. Consectetur kampuang nan jauh dimato ambo-ambo tempe goreng enak rasanya. Sed diam nonumy ummy-ummy eirmod tempor kuch-kuch hota hai. Mere-mere mereketehe ut labore et dolore magna aliquyam alhamdulillah. Ut labore et dolore magna calcilua cit silit pitik. Vivanius et labore et quis lacinia quam ante eu mah didie pahlawan bertopeng. Encing enyak babeh ayuh semua nonton tipi kite. Mauris mauris ante meridiem blandit suscipit eros. Vivamus nisi metus meletus brot.

Dolor

List item
List item
List item
List item
List item
List item
List item

Sit Amet

Jabang Bayi

Lorem ipsum dolor sit amet-amet jabang bayi oek-oek. Consectetur kampuang nan jauh dimato ambo-ambo tempe goreng enak rasanya.

Panel ke Empat Terbuka

Pemicu 1

Pemicu 2

Pemicu 3

List item
List item
List item
List item
List item
List item
List item

Pemicu 4

Pemicu 5

JQuery UI Accordion, FillSpace

Pemicu 1

Pemicu 2

Pemicu 3

List item
List item
List item
List item
List item
List item
List item

UI Accordion, Custom Icons

Lorem

Ipsum

Dolor

List item
List item
List item
List item
List item
List item
List item

Sit Amet

Jabang Bayi

Lorem ipsum dolor sit amet-amet jabang bayi oek-oek. Consectetur kampuang nan jauh dimato ambo-ambo tempe goreng enak rasanya.

JQuery UI Accordion

Pemicu 1

Pemicu 2

Pemicu 3

List item
List item
List item
List item
List item
List item
List item

JQuery UI Accordion AutoHeight

autoHeight:true

Lorem

Ipsum

Dolor

List item
List item
List item
List item
List item
List item
List item

Sit Amet

Jabang Bayi

Lorem ipsum dolor sit amet-amet jabang bayi oek-oek. Consectetur kampuang nan jauh dimato ambo-ambo tempe goreng enak rasanya.

List item
List item
List item
List item
List item
List item
List item

Blind Horizontal

$("#blindHorizontally").hide("blind", {direction:"horizontal"}, 1000);
Blind Vertikal

$("#blindVertically").hide("blind", {direction:"vertical"}, 1000);
Bounce 3 ×

$("#bounce3times").hide("bounce", {times:3}, 1000);
Clip Horizontal

$("#clipHorizontally").hide("clip", {direction:"horizontal"}, 1000);
Clip Vertikal

$("#clipVertically").hide("clip", {direction:"vertical"}, 1000);
Drop Down

$("#dropDown").hide("drop", {direction:"down"}, 1000);
Drop Up

$("#dropUp").hide("drop", {direction:"up"}, 1000);
Drop Left

$("#dropLeft").hide("drop", {direction:"left"}, 1000);
Drop Right

$("#dropRight").hide("drop", {direction:"right"}, 1000);
Explode 9 Potongan (default)

$("#explode9").hide("explode", 1000);
Explode 36 Potongan

$("#explode36").hide("explode", {pieces:36}, 1000);
Fold menuju 15 (default)

$("#fold").hide("fold", 1000);
Fold menuju 50

$("#fold-50").hide("fold", {size:50}, 1000);
Fold menuju 50%

$("#fold-half").hide("fold", {size:"50%"}, 1000);
Fold Horizontal First

$("#fold-horf").hide("fold", {size:30, horizFirst:true}, 1000);
Highlight

$("#highlight").effect("highlight", {mode:"show"}, 1000);
Pulsate 2 ×

$("#pulsate").hide("pulsate", {times:2}, 1000);
Puff 150% (default)

$("#puff").hide("puff", 1000);
Puff 300%

$("#puff-to").hide("puff", {percent:300}, 1000);
Scale

$("#scale").hide("scale", 1000);
Scale Top-Left

$("#scale-topleft").hide("scale", {origin:["top", "left"]}, 1000);
Scale Bottom-Right

$("#scale-botright").hide("scale", {origin:["bottom", "right"]}, 1000);
Size

$("#size").effect("size", {to:{width:70, height:30}, 1000);
Shake

$("#shake").effect("shake", 100);
Shake 20 ×

$("#shake-20").effect("shake", {times:20}, 100);
Slide Down

$("#boks").hide("slide", {direction:"down"}, 1000);
Slide Up

$("#slideUp").hide("slide", {direction:"up"}, 1000);
Slide Left

$("#slideLeft").hide("slide", {direction:"left"}, 1000);
Slide Right

$("#slideRight").hide("slide", {direction:"right"}, 1000);
Transfer ke #slideLeft

$("#transfer").effect("transfer", {to:"#slideLeft"}, 1000);

delay:1000

distance:40

$('img').resizable({helper:"garis-bantu", animate:true, animateDuration:1000, animateEasing:"easeOutElastic"});

Berat Badan Anda?

$('#slider').slider({orientation:"vertical", range:"min"}).height(420);

.slider({range:"min", value:30});

.slider({range:"max", value:30});

Default

Dengan Step

.slider({value:30});

autoHeight:true

autoHeight:false

Tanpa JQuery UI

Dengan JQuery UI

Memanipulasi Elemen CheckBox

Memanipulasi Elemen Radio dan CheckBox hanya dengan .button()

Framework Ikon JQuery UI 1.8.16

Blind Horizontal

Blind Vertikal

Bounce 3 ×

Clip Horizontal

Clip Vertikal

Drop Down

Drop Up

Drop Left

Drop Right

Explode 9 Potongan (default)

Explode 36 Potongan

Fold menuju 15 (default)

Fold menuju 50

Fold menuju 50%

Fold Horizontal First

Highlight

Pulsate 2 ×

Puff 150% (default)

Puff 300%

Scale

Scale Top-Left

Scale Bottom-Right

Size

Shake

Shake 20 ×

Slide Down

Slide Up

Slide Left

Slide Right

Transfer ke #slideLeft

Arsip Demo