Source :
<hlayout width="1024px">
<separator width="150px"></separator>
<window id="t" title="This is a Window" border="normal" width="300px">
<vlayout style="text-align:center;">
<image src="/widgets/effects/jQuery_effects/img/magic_wand_hat.png"></image>
jQuery Effect Test
</vlayout>
</window>
<groupbox closable="false" sclass="z-demo-config" xmlns:w='client'>
<caption label="Effect" />
<vlayout>
<button height="30px" width="200px" label="Slide Down"
w:onClick="jq(this.$f('t')).hide().slideDown(1000)" />
<button height="30px" width="200px" label="Slide Up"
w:onClick="jq(this.$f('t')).show().slideUp(1000)" />
<button height="30px" width="200px" label="Fade In"
w:onClick="jq(this.$f('t')).hide().fadeIn()" />
<button height="30px" width="200px" label="Fade Out"
w:onClick="jq(this.$f('t')).show().fadeOut()" />
<button height="30px" width="200px" label="Slide Toggle"
w:onClick="jq(this.$f('t')).slideToggle(1000)" />
</vlayout>
</groupbox>
</hlayout>
Hasil :