easyUI学习笔记二

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();
})

View Code

2． Tooltip 提示框

$(function(){
$("#box").tooltip({
content:"提示框"
})
})

View Code

<body><a href="" id="box">点击我</a>
</div></body>

View Code

3． Progressbar

$(function(){$("#box").progressbar({value:30,height:50,width:400,text:'{value}元'});})

View Code

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>

View Code

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>