`
aa00aa00
  • 浏览: 331514 次
  • 性别: Icon_minigender_1
  • 来自: 沈阳
文章分类
社区版块
存档分类
最新评论

Ext.Panle Ext.TabPanel Ext.Viewport2

EXTJavaScriptCSSHTML 
阅读更多

<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../ext-all.js"></script>
<script type="text/javascript" src="../examples.js"></script>
<script language="javascript">

function panel(){
var panel=new Ext.Panel({
renderTo:'panel',
title:'面板的头部',
width:400,
height:200,
html:'<h1>面板的主显示区域..可包含任何html代码</h1>',
tbar:[{text:'顶部工具栏按钮'}],
bbar:[{text:'底部工具栏'}],
buttons:[
{
text:'面板底部按钮',
handler:function()
{
Ext.Msg.alert('提示','面板底部按钮的事件！');
}
}
]
});
}
</script>
</head>
<body>
<input type="button" onclick="panel()" value="显示面板">
<hr/>
<div id="panel"></div>
</body>
</html>

 

特别注意的一点是renderTo:'panel'，这句代码负责把面板绑定到一个div层里，panel就是div的ID。
<div id="panel"></div>

分享到：
| extjs 之Ext.Panle Ext.TabPanel Ext.Viewp ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    ExtJs 学习笔记 Ext.Panle Ext.TabPanel Ext.Viewport第1/3页

    ExtJs是一个基于JavaScript的框架，用于构建前端交互式的Web应用程序。...学习和掌握Ext.Panel、Ext.TabPanel和Ext.Viewport的使用方法，可以帮助我们更好地设计和实现富有交互性和视觉吸引力的Web应用程序界面。

    extjs中Ext.Panel和TreePanel 组件动态加载本地页面数据

    在EXTJS这个强大的JavaScript框架中，`Ext.Panel`和`TreePanel`是两个非常重要的组件，它们被广泛用于构建复杂的用户界面。这篇文章将探讨如何在这些组件中动态加载本地页面数据，以提升用户体验并实现灵活的数据...

    Extjs自动最大化panel

    2. **尺寸配置**：`autoWidth`和`autoHeight`属性分别可以让Panel宽度和高度自适应，当这些属性设置为`true`时，Panel会根据其父容器的尺寸自动调整大小。 3. **事件监听**：可能需要监听窗口或容器的resize事件，...

    EXT例子

    `window2.jsp`可能是关于EXT JS Window组件的一个示例，Window组件常用于创建可移动、可调整大小的弹出视图。它可以包含其他EXT组件，如按钮、表单等，用于提供更复杂的交互。 3. **Panel**： Panel是EXT的基础...

    Delphi XE2+Dev 主窗体Panle嵌入DLL窗体源码

    2. **通信接口设计**：为了使主程序能够与DLL进行交互，你需要定义一套接口。这些接口可以是导出的函数或方法，用于在主程序和DLL之间传递数据、调用窗体功能等。 3. **嵌入Panel控件**：在主程序中，你需要创建一...

    22寸panle金手指贴胶带sw18可编辑.zip

    2. **X轴移位机构**：负责抓取并移动液晶面板到指定的贴胶位置。这一机构通常由直线模组组成，结合步进电机或伺服电机，实现快速、准确的水平定位。 3. **抓取装置**：设计用于安全地抓住液晶面板的边缘，避免对金...

    22寸panle金手指贴胶带sw18可编辑.rar

    标题中的“22寸panle金手指贴胶带sw18可编辑.rar”指的是一个针对22英寸面板（Panel）的电子设备设计相关的文件压缩包。金手指是电子设备连接器中的一种，通常用于电路板之间的插拔连接，其表面镀金以提高接触性能和...

    机械设计22寸panle金手指贴胶带sw18可编辑非常好的设计图纸100%好用.zip

    在这个压缩包文件中，"22寸panle金手指贴胶带sw18可编辑非常好的设计图纸100%好用.zip"，包含了2023年5月份设计的22寸Panel金手指贴胶带的详细设计方案。SW18可能是设计中特定的规格或型号，代表了胶带的宽度、材质...

    C#自定义Panle垂直滚动条

    2. **启用AutoScroll属性**： 在自定义Panel类中，将AutoScroll属性设置为true，这将自动在需要时显示滚动条。 ```csharp public CustomScrollablePanel() { this.AutoScroll = true; } ``` 3. **计算滚动条**： ...

    frame panle

    标题中的"frame panel"指的是Java Swing中的两种基本组件——JFrame和JPanel。在Java GUI编程中，JFrame是窗口的基础，它代表了一个应用程序的主窗口，而JPanel则是一种容器，可以用来组织和显示其他组件，如按钮、...

    Ecmall结构汇总 .docx

    - `template_panle.css`：模版编辑的样式文件。 - `js`目录下的`admin.js`、`index.js`和`navigation.js`：后台管理的JavaScript功能文件，负责交互逻辑。 ### 5. 数据库操作 `db.app.php`是数据库控制类，负责与...

    C# winform动态添加和删除用户控件.rar

    2. 实例化用户控件：在需要动态添加的地方，使用`new`关键字实例化用户控件对象，例如： ```csharp UserControl1 myUserControl = new UserControl1(); ``` 3. 添加控件到容器：将用户控件添加到窗体或容器控件...

    PanelView Plus触摸屏ModbusTCP通讯

    2. **Kepserver 与 FactoryTalk View ME 软件的对应关系**：安装 Kepserver 软件时需要选择要安装的驱动，例如在本例中选择“Modicon Modbus Suite”。 3. **Kepserver 设置**：Kepserver 软件可以不需要安装授权...

    ecmall2.2整理文件目录结构

    这两个子目录分别存储了后台管理所需的图片资源和CSS样式文件，如`login.css` 是后台登录页面的样式，`template_panle.css` 用于后台模版编辑的样式。 7. **templates/js** - 后台管理JS文件 存放了与后台模板...

    窗体控件自动布局(自动布局窗体中控件)

    1)首先在录入数据的地方用GroupBox或者Panle作为容器(目前里面配置了这2中数据信息用户可以在ParentControlHeader类中进行相应配置) 2)然后在该容器中加入TableLayOutPanle控件,并设定行和列(例如:设定6列,奇数列...

    winform 窗体打印panel

    panel1.Location = new Point((e.MarginBounds.Width - panel1.Width) / 2, (e.MarginBounds.Height - panel1.Height) / 2); // 将Panel的内容绘制到打印页面 panel1.DrawToBitmap(e.MarginBounds, e.Graphics);...

    c#自定义圆角panel

    AddArc(rect.Right - radius - 1, rect.Bottom - radius - 1, radius * 2, radius * 2, 0, 90); AddLine(rect.Right - 1, rect.Bottom - radius - 1, rect.Right - 1, rect.Top + radius); AddArc(rect.Right - ...

    C#用PictureBox控件实现图片切换.rar

    private List&lt;string&gt; imagePaths = new List&lt;string&gt; { "image1.jpg", "image2.jpg", "image3.jpg" }; private int currentImageIndex = 0; private void btnPrev_Click(object sender, EventArgs e) { if ...

    C#控件随窗口变化而变化，同时panel中的控件也变化，代码实现

    2. 对于Panel控件，设置其`AutoSizeMode`为`GrowAndShrink`，使其可以随窗体大小变化而改变自身大小。 3. 对于Panel内的每一个控件，设置合适的`AutoSizeMode`，如`GrowAndShrink`或`GrowOnly`，以及适当的`Anchor`...

Magicbox
Global site tag (gtag.js) - Google Analytics