引言
進行過WEB開發的人員都應該對JQuery easyUI有所耳聞了,與ExtJs風格有點類似,我個人覺得比ExtJS好用。
正文
EasyUI作爲一個輕量級的UI插件,提供了常用的UI控件accordion,combobox,menu,dialog,tabs,tree,validatebox,window等等。
下面我們就Accordion 手風琴 效果做一個簡單入門案例:
基本代碼
[html] view plaincopy
<span style="font-size:14px"> <html>
<head>
<title>Accordion示例</title>
<script src="../jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="../jquery.easyui.min.js" type="text/javascript"></script>
<link href="../themes/default/easyui.css" rel="stylesheet" type="text/css" />
<link href="../themes/icon.css" rel="stylesheet" type="text/css" />
<script type="text/javascript"></script>
</head>
<body>
<div style="overflow:auto;width:600px;height:300px;padding:10px;border:1px solid #ccc;">
<div id="aa" class="easyui-accordion" fit="true" style="width:300px;height:200px;">
<div title="Title1" style="overflow:auto;padding:10px;">
<h3>Accordion1</h3>
</div>
<div title="Title2" style="padding:10px;">
<h3>Accordion2</h3>
</div>
<div title="Title3">
<h3>Accordion3</h3>
</div>
</div>
</div>
</body>
</html></span>
注意:jquery-1.4.2.min.js和jquery.easyui.min.js必須引用
總結
其實Jquery easyUI 利用它可以編寫少量的js代碼就能運行出比較華麗的js效果,提高的Web開發效率。下面我爲大家提供一些地址:
官方網站:http://jquery-easyui.wikidot.com/start
下載地址:http://jquery-easyui.wikidot.com/download
官方的API文檔爲:http://jquery-easyui.wikidot.com/document
原文出處:http://blog.csdn.net/renzhe333/article/details/15122297