<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>Window Layout - jQuery EasyUI Demo</title>

    <link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">

    <link rel="stylesheet" type="text/css" href="../../themes/icon.css">

    <link rel="stylesheet" type="text/css" href="../demo.css">

    <script type="text/javascript" src="../../jquery.min.js"></script>

    <script type="text/javascript" src="../../jquery.easyui.min.js"></script>

</head>

<body>

    <h2>Window Layout</h2>

    <p>Using layout on window.</p>

    <div style="margin:20px 0;">

        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#w').window('open')">Open</a>

        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#w').window('close')">Close</a>

    </div>

    <div id="w" class="easyui-window" title="Window Layout" data-options="iconCls:'icon-save'" style="width:500px;height:200px;padding:5px;">

        <div class="easyui-layout" data-options="fit:true">

            <div data-options="region:'west',split:true" style="width:100px">的撒的的撒</div>

             <div data-options="region:'center'" style="padding:10px;">

                jQuery EasyUI framework help you build your web page easily.

             </div>

            <div data-options="region:'east'" style="width:100px">dsadasdsa</div>

            <div data-options="region:'south',border:false" style="text-align:right;padding:5px 0 0;">

                <a class="easyui-linkbutton" data-options="iconCls:'icon-ok'" href="javascript:void(0)" onclick="javascript:alert('ok')" style="width:80px">Ok</a>

                <a class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" href="javascript:void(0)" onclick="javascript:alert('cancel')" style="width:80px">Cancel</a>

            </div>

        </div>

    </div>

</body>

</html>

jquery easy ui 学习 （5） windowlayout的更多相关文章

  1. jquery easy ui 学习 （6） basic validatebox

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. jquery easy ui 学习 （9）Pagination in TreeGrid 分页

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. jquery easy ui 学习 （8）basic treegrid

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. jquery easy ui 学习 （7） TreeGrid Actions

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. jquery easy ui 学习 （4） window 打开之后 限制操纵后面元素属性

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. jquery easy ui 学习 （3） window 限制在父类窗体内

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. jquery easy ui 学习 （2） customtools window

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. jquery easy ui 学习 （1）Basic Window

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. jQuery Easy UI Panel(面板)组件

    panel(面板)组件,跟前面的组件使用方法差点儿都差点儿相同,也是从设置一些面板属性.操作面板触发的事件.我们可针对面板对象的操作方法这三个点去学习. 后面有一些组件要依赖于这个组件. 另一点跟前面 ...

随机推荐

  1. HDOJ(HDU) 2138 How many prime numbers(素数-快速筛选没用上、)

    Problem Description Give you a lot of positive integers, just to find out how many prime numbers the ...

  2. <一>初探js特效魅力之全选不选反选04

    初探js特效魅力04 我们在进入到公司里面工作的时候,做一个同一个项目,经常是大家分工合作,当我们写css时,一般不写在行间,因为这样会被误操作,也就是被乱删了都不知道,这样的后果是很难检查的 ,因为 ...

  3. 一篇文章看懂spark 1.3+各版本特性

    Spark 1.6.x的新特性Spark-1.6是Spark-2.0之前的最后一个版本.主要是三个大方面的改进:性能提升,新的 Dataset API 和数据科学功能的扩展.这是社区开发非常重要的一个 ...

  4. android图片缓存框架Android-Universal-Image-Loader

    http://blog.csdn.net/king_is_everyone/article/details/34107081 最近跟同学们做了一个创业项目,其实跟以前做项目不同,以前大多数都是做web ...

  5. strus2与spring3 mvc的差别

    比较了一下strus2与spring3 mvc的差别: spring3 mvc是方法级别的拦截,拦截到方法后根据参数上的注解,把request数据注入进去,在spring3mvc中,一个方法对应一个r ...

  6. 深入探索C++对象模型-1

    概述 在实际生产中,遇到一个复杂的类,如果能看出这个类的内存模型结构,那么以后的操作基本就没有难度的: 所以说,学会分析一个类的内存模型,是每一个C++程序员必须要会的知识. 下面,就让我们来了解C+ ...

  7. nmap使用方法

      你是否曾想知道你所在局域网中哪些IP已经被使用了?还有哪些IP地址没有被使用?是否想知道某个IP地址下是什么系统…… 这些问题我们都可以使用一个nmap的工具解决,下面,就让我们开始了解nmap. ...

  8. lvs+heartbeat搭建负载均衡高可用集群

    [172.25.48.1]vm1.example.com [172.25.48.4]vm4.example.com 集群依赖软件:

  9. 中国剩余定理模板poj1006

    #include <cstdio> #include <iostream> #include <cstring> #include <cmath> #i ...

  10. 转载：C#实现接口回调

    通常情况下,我们创建一个对象,并马上直接去使用它的方法.然而,在有些情况下,希望能在某个场景出现后或条件满足时才调用此对象的方法.回调就可以解决这个“延迟调用对象方法”的问题.这个被调用方法的对象称为 ...