1． 拖拉大小
<!DOCTYPE html>
<html>
<head>
<title>easyui学习</title>
<script type="text/javascript" src = jquery-easyui/jquery.min.js> </script>
<script type="text/javascript" src = jquery-easyui/jquery.easyui.min.js> </script>
<script type="text/javascript" src = jquery-easyui/locale/easyui-lang-zh_CN.js> </script> <script type="text/javascript" src ="index.js"></script> <!-- 自定义js --> <link rel="stylesheet" href="jquery-easyui/themes/default/easyui.css">
<link rel="stylesheet" href="jquery-easyui/themes/icon.css">
</head>
<body>
<div id="dd" data-options="maxWidth:600,maxHeight:600" style="width: 100px;height: 100px;border:1px solid" ></div>
</div> </body>
</html>
$(function(){
$('#dd').resizable();
})
2． Tooltip 提示框
$(function(){
$("#box").tooltip({
content:"提示框"
})
})
<body>
<a href="" id="box">点击我</a>
</div> </body>
3． Progressbar
$(function(){
$("#box").progressbar({
value:30,
height:50,
width:400,
text:'{value}元'
});
})
4． Accordion
</body> <body>
<div id='box' class="easyui-accordion" style="width: 200px;">
<div title="ad1">ad1</div>
<div title="ad2">ad2</div>
<div title="ad2">ad2</div>
</div> </body>
5． Layout
<body>
<div id='box' style="width: 400px"></div> <body id="box" class="easyui-layout"> <div data-options="region:'north' " style="height: 100px" title="上北" ></div>
<div data-options="region:'south' " style="height: 100px" title="下南" ></div>
<div data-options="region:'west' " style="width: 100px" title="左西" ></div>
<div data-options="region:'east' " style="width: 100px" title="右东" ></div>
<div data-options="region:'center' " title="中间" ></div>
</body>
