jquery easyUI 后台布局
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <base href="<%=basePath%>"> <title>test</title><link rel="stylesheet" type="text/css" href="<%=basePath%>themes/icon.css"><link rel="stylesheet" type="text/css" href="<%=basePath%>themes/default/easyui.css"><script type="text/javascript" src="<%=basePath%>js/base/jquery-1.4.4.min.js"></script><script type="text/javascript" src="<%=basePath%>js/base/jquery.easyui.min.js"></script><script type="text/javascript">$(function(){$('body').layout("collapse","south");$('#tt2').tree({url: 'tree_data.json',onClick:function(node){//$(this).tree('toggle', node.target);//alert('you dbclick '+node.text);$("#iframe").attr("src",node.attributes.url);}});});</script> </head> <body style="width:150px;"><div>item1</div><div>item2</div></div><div region="north" title="North Title" split="true" style="height:50px;padding:10px;"></div>><%--<div region="east" iconCls="icon-reload" title="Tree Menu" split="true" style="width:180px;"><ul url="tree_data.json"></ul></div>--%><div region="west" split="true" title="West Menu" style="width:150px;padding1:1px;overflow:hidden;"><ul id="tt2" title="Main Title" style="overflow:hidden;"><iframe id="iframe"width="100%" height="100%" src="http://www.baidu.com"></iframe></div><div region="south" layout="collapse" title="South Title" collapsible="true" style="height:100px;padding:10px;background:#efefef;"></div></body></html>?[{"id":1,"text":"供应商管理","iconCls":"icon-ok","children":[{"id":2,"text":"供应商管理","checked":true,"attributes":{ "url":"suppliers/index.zul" }}]},{"id":2,"text":"对象管理","iconCls":"icon-ok","children":[{"id":2,"text":"对象管理","checked":true,"attributes":{ "url":"targets/index.zul" }}]}]?