JQuery Easyui Window – Create a simple window

JqueryEasyui Window – Create a simple window

Creating a window is very simple, we create a DIV tag:

<div id= "Win" class= "Easyui-window" title= "My window" style= "WIDTH:300PX;HEIGHT:100PX;PADDING:5PX;" >    Some content.</div>

　　

Now run the test page and you will see a window displayed on your screen. We don't need to write any JavaScript code.

If you want to create a hidden window (Windows), remember to set the ' Closed ' property to ' true ' value, you can call the ' open ' method to open the window:

<div id= "Win" class= "Easyui-window" title= "My window" closed= "true" style= "width:300px;height:100px;padding:5px;" >    Some content.</div>

　　

$ (' #win '). Window (' open ');

　　

As a final example demonstration, we create a login window (Windows):

<div id= "Win" class= "Easyui-window" title= "Login" style= "width:300px;height:180px;" >    <form style= "padding:10px 20px 10px 40px;" >        <p>name: <input type= "text" ></p>        <p>pass: <input type= "Password" ></p >        <div style= "Padding:5px;text-align:center;" >            <a href= "#" class= "Easyui-linkbutton" icon= "Icon-ok" >Ok</a>            <a href= "#" class= " Easyui-linkbutton "icon=" Icon-cancel ">Cancel</a>        </div>    </form></div>

　　

JQuery Easyui Window – Create a simple window