-
Notifications
You must be signed in to change notification settings - Fork 52
/
Copy pathindex.html
92 lines (91 loc) · 4.91 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery UI Portlet</title>
<!-- jquery 1.4 and jquery ui 1.8 -->
<link rel="stylesheet" href="lib/themes/1.10/start/jquery-ui-1.10.2.custom.min.css" />
<link rel="stylesheet" href="css/jquery.portlet.css?v=1.3.1" />
<style type="text/css">
body {font-size: 10px;}
#menu li {font-size: 13px;}
#LeftPane {
overflow: auto;
}
#RightPane {
padding: 2px;
overflow: auto;
}
.ui-layout-resizer div {background-color: red;}
.new {background-image: url(new.png) !important;background-repeat:no-repeat !important;background-position: right center !important;}
.chat {background-image: url(duoshuo.png) !important;background-repeat:no-repeat !important;background-position: right center !important;}
.api {background-image: url(api.png) !important;background-repeat:no-repeat !important;background-position: right center !important;}
.source-github {background-image: url(github-small.png) !important;background-repeat:no-repeat !important;background-position: right center !important;}
</style>
<script src="lib/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="lib/jquery-ui-1.10.2.custom.min.js" type="text/javascript"></script>
<script src="lib/jquery.layout-latest.min.js" type="text/javascript"></script>
<script src="script/jquery.portlet.pack.js?v=1.3.1"></script>
<script>
$(function() {
$('body').layout({
west: {
size: 160
},
onresize : function() {
setTimeout(function() {
$('#mainFrame').width($('#RightPane').width() - 4);
$('#mainFrame').height($('#RightPane').height() - 4);
}, 500);
}
});
$('#mainFrame').width($('#RightPane').width() - 4);
$('#mainFrame').height($('#RightPane').height() - 4);
$( "#menu" ).width($('#LeftPane').width() - 7).menu();
$('#tabs').tabs();
$('#menu a').click(function() {
$('#menu .ui-state-active').removeClass('ui-state-active');
$(this).parent().addClass('ui-state-active');
$('#mainFrame').attr('src', $(this).attr('rel'));
});
});
</script>
</head>
<body>
<div id="TopPane" class="ui-layout-north ui-widget ui-widget-content ui-state-default" style="text-align:center">
<img src="logo-ui.png" style="float:left" height="68" />
<h1 style='display:inline;margin-top:5em;'>jQuery UI Portlet</h1>
<h4 style='display:inline;margin-left: 1em;'>（Version: 1.3.1） 基于jQuery UI的Portlet插件</h4>
<div stle="padding-top:10em;display:block">
<br/>
<img src="github.png" height="30" alt="" style="vertical-align:middle"/>
<a href="https://github.com/henryyan/jquery-ui-portlet" target="_blank" style="font-size:15px;">https://github.com/henryyan/jquery-ui-portlet</a>
</div>
</div>
<div id="LeftPane" class="ui-layout-west ui-widget ui-widget-content">
<ul id="menu">
<li class='ui-state-default'><a href='#' rel="#">==插件文档==</a></li>
<li><a href='#' class="api" rel="api.html">插件API</a></li>
<li><a href='#' class="source-github" rel="demo/source-on-github.html">插件源码</a></li>
<li class='ui-state-highlight'><a href='#' rel="#">==插件演示==</a></li>
<li><a href='#' rel="demo/mix.html">综合演示</a></li>
<li><a href='#' rel="demo/fixed-height.html">固定高度</a></li>
<li><a href='#' rel="demo/disable-drag.html">禁止拖动</a></li>
<li><a href='#' rel="demo/single-view.html">单视图模式</a></li>
<li><a href='#' rel="demo/icon.html">标题栏图标</a></li>
<li><a href='#' rel="demo/colspan.html">跨列模式</a></li>
<li><a href='#' rel="demo/bootstrap.html">Bootstrap主题</a></li>
<li><a href='#' rel="demo/getindexs.html">获取[行/列]</a></li>
<li><a href='#' rel="demo/toggle.html">隐藏/显示切换</a></li>
<li><a href='#' rel="demo/drag-events.html">拖动事件</a></li>
<li><a href='#' class="new" title="动态添加、删除portlet元素" rel="demo/dynamic-add.html">动态增删（v1.3）</a></li>
<li><a href='#' class="new" rel="demo/v1.3-new-events.html">新事件(v1.3)</a></li>
<li class='ui-state-highlight'><a href='#' class="chat" rel="talk.html">讨论插件</a></li>
</ul>
</div>
<div id="RightPane" class="ui-layout-center ui-helper-reset ui-widget-content">
<iframe id="mainFrame" src="talk.html" frameborder="0"></iframe>
</div>
<script src="http://s96.cnzz.com/stat.php?id=2566493&web_id=2566493&show=pic" language="JavaScript"></script>
</body>
</html>