首页 > 代码库 > zk jquery的使用

zk jquery的使用

jQuery_effects.zul:

<?page title="Jquery" contentType="text/html;charset=UTF-8"?><z:zk xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"         xmlns:z="http://www.zkoss.org/2005/zul"         xsi:schemaLocation="http://www.zkoss.org/2005/zul http://www.zkoss.org/2005/zul"><z:hlayout width="600px">    <z:separator width="150px"/>    <z:window id="testWin" title="This is a Window" border="normal" width="300px">        <z:vlayout style="text-align:center;">            <z:image src="http://www.mamicode.com/images/green.png"/>            jQuery Effect Test        </z:vlayout>            </z:window>        <z:window>        <z:include src="http://www.mamicode.com/jQuery_effects_ctrl.zul"/>    </z:window></z:hlayout></z:zk>

jQuery_effects_ctrl.zul:

<?page title="Jquery" contentType="text/html;charset=UTF-8"?><z:zk xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"         xmlns:z="http://www.zkoss.org/2005/zul"         xsi:schemaLocation="http://www.zkoss.org/2005/zul http://www.zkoss.org/2005/zul"><z:groupbox closable="false" sclass="z-demo-config" xmlns:zk=‘client‘>    <z:caption label="Effect" />    <z:vlayout>        <z:button height="30px" width="100%" label="Slide Down"             zk:onClick="jq(‘$testWin‘).hide().slideDown(1000)" />        <z:button height="30px" width="100%" label="Slide Up"             zk:onClick="jq(‘$testWin‘).show().slideUp(1000)" />        <z:button height="30px" width="100%" label="Fade In"             zk:onClick="jq(‘$testWin‘).hide().fadeIn()" />        <z:button height="30px" width="100%" label="Fade Out"             zk:onClick="jq(‘$testWin‘).show().fadeOut()" />        <z:button height="30px" width="100%" label="Slide Toggle"             zk:onClick="jq(‘$testWin‘).slideToggle(1000)" />    </z:vlayout></z:groupbox></z:zk>

 

zk jquery的使用