f30-1872505.zul

ZK是一个Ajax Java Web框架

<?xml version="1.0" encoding="UTF-8"?>

<!--
F30-1872505.zul

{{IS_NOTE
	Purpose:
		
	Description:
		
	History:
		Wed Jan 16 16:27:42 TST 2008, Created by jumperchen
}}IS_NOTE

Copyright (C) 2007 Potix Corporation. All Rights Reserved.

{{IS_RIGHT
}}IS_RIGHT
-->
<zk xmlns:n="http://www.zkoss.org/2005/zk/native">
<n:h2>[ 1872505]   Provide a "parent" position for Window component.</n:h2>
	<n:ol>
		<n:li>Try overlapped Nestedwindow and move it to some where, then click overlpaped inner window, the nestedwindow position should be changed follow the inner window</n:li>
		<n:li>move the inner window, the nextedwindow position should follow the new position too.</n:li>
                <n:li>embed the nextedwindow, it should back to the inner window</n:li>
                <n:li>change textbox of top and left value and click save, the position will change ,(in IE, two field must both assigned.)</n:li>
	</n:ol>
<window border="none" style="border:1px solid black;">
	If the property of InnerWindow's position is a "parent", the moved message will indicate the position of window inside its parent not "body" node.  
	<separator bar="true"/>
	<button label="overlapped" onClick="win2.doOverlapped()" />
	<button label="embed" onClick="win2.doEmbedded()" />
	<button label="modal" onClick="win2.doModal()" />
	<hbox>
		Top :
		<intbox id="top" />
		Left:
		<intbox id="left" />
		<button label="save"
			onClick='win2.top = top.value + "px";win2.left = left.value + "px";' />
	</hbox>
	<hbox>
		Position :
		<radiogroup onCheck="win2.position = self.selectedItem.label">
			<radio label="center" />
			<radio label="parent" />
			<radio label="top" />
		</radiogroup>
	</hbox>
	<div id="mapCanvas"
		style="position:relative;height:300px;width:800px;border: 1px solid blue;">
		<window id="win2" border="normal" width="450px" top="50px" height="200px" style="overflow:visible;"
			left="50px" title="InnerWindow- top=50px, left=50px- position=parent" position="parent"
			onMove='msg.value = "Inner: " + event.top + "," + event.left;'>
			<window id="win3" border="normal" width="300px" top="50px"
				onMove='msg1.value = "Nexted: " + event.top + "," + event.left;'
				left="50px" title="NestedWindow-pos=parent" position="parent">
				<button label="embed NestedWindow"
					onClick="win3.doEmbedded()" />
			</window>
			<button label="embed InnerWindow"
				onClick="win2.doEmbedded()" />
			<button label="overlapped NestedWindow"
				onClick="win3.doOverlapped()" />
		</window>
	</div>
	<vbox>
		<label style="color:brown" id="msg" value="Please move the InnerWindow..."/>
		<label style="color:red" id="msg1" value="Please move the NestedWindow..."/>
	</vbox>
</window>
</zk>