panel


panel
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
  <head>
   
    <!-- easyui的样式 -->
    <link rel="stylesheet" type="text/css" href="../js/jquery-easyui-1.3.1/themes/gray/easyui.css">
    <!-- 小图标的样式 -->
    <link rel="stylesheet" type="text/css" href="../js/jquery-easyui-1.3.1/themes/icon.css">
   
    <script type="text/javascript" src="../js/jquery-easyui-1.3.1/jquery-1.8.0.min.js"></script>
    <script type="text/javascript" src="../js/jquery-easyui-1.3.1/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="../js/jquery-easyui-1.3.1/locale/easyui-lang-zh_CN.js"></script>
 
 <script type="text/javascript">
  $(function(){
   
  });
 </script>
 
  </head>
 
  <body>
  <div id="p" class="easyui-panel" title="My Panel"
   style="width: 500px; height: 150px; padding: 10px; background: #fafafa;"

   <!-- 可以将很多配置集中写到data-options中-->
   data-options="iconCls:'icon-save',closable:true,
                collapsible:true,minimizable:true,maximizable:true">
   <p>panel content.</p>
   <p>panel content.</p>
  </div>
  
  <input type="button" value="close panel" onclick="$('#p').panel('close')">
  <input type="button" value="show panel" onclick="$('#p').panel('open')">
 </body>
</html>

 

 

你可能感兴趣的:(Panel)