Tags
People
Badges
Help-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
Do anyone tell how can I set <window> object in the middle of the screen of ZUL page?
I wonder that should/could I use simple HTML tag in ZUL.
I have tried to use <div style="margin: 100 100 auto"> to test. However, it did not work.
Please help.
Thanks a lot.
Kenneth
take a look at this:
Window in ZK Demo
Do you mean that I should use borderlayout to locate the <window> tag at the center of web page like the follows?
<borderlayout height="300px">
<north></north>
<center border="1">
<window>...</window>
</center>
<south></south>
</borderlayout>
In actual, I have tried it before. Definitely, it is the only solution I've found.
However, this solution is not really good.
1. <window> tag is not really stayed center of the page because it depends on the height value I assigned for <north> tag.
2. Not only <north> and <south> tag, <east> and <west> are the essential elements to make the <window> tag centered.
3. It is very annoying if I should set background color to the whole page. I need to override many tags background color style (i.e. north, east, south, west ...)
Do anyone still have alternatives provide?
Thanks kindalu.
However, that demo is only applicable if the window is not embedded.
Let's use the ZK Live Demo "Hello World" as example.
http://www.zkoss.org/zkdemo/userguide/#f1
The following codes are copied from the demo:
<window title="My First Window" border="normal" width="200px">
Hello, World!
</window>
As we know, the position of that window is starting from relative zero point.
How can I make the window positioned to other coordinations?
Would you please post the codes that I can move "Hello World" window to other position in demo? (P.S. Embedded mode ... not overlap and popup)
No, it doesn't work.
As mentioned in the beginning, I have tried to use the codes as follow.
<div style="margin: 100 100 auto">
<window></window>
</div>
For many legacy systems, centered the table in the middle of web page is very common.
<center>
<table><tr>....</table>
</center>
No one like me suffered in this problem?
I mean something like this:
<div height="500px" width="600px" style="background:black"> <window title="My First Window" border="normal" width="200px" style="background:white; position:relative; top:100px;left:100px;"> Hello, World! </window> </div>
Don't forget position relative.
(^_^)y
All buddies,
I have found what has happened.
<div style="margin: 100 100 auto">
<window></window>
</div>
The above code should work if margin unit is assigned.
<div style="margin: 100px 100px auto">
Likewise, the following code also works.
<window style="margin: 100px 100px auto">
At last, I also find the solution to center the <window> tag.
<zk>
<html>
<attribute name="content">
<![CDATA[
<center>
]]>
<window id="login" width="100%">
New Content Here!
</window>
<![CDATA[
</center>
]]>
</attribute>
</html>
</zk>
Thanks anyone help~~
Asked: 2009-06-01 09:11:10 +0800
Seen: 314 times
Last updated: Jun 03 '09
