`

布局之accordion布局

EXTJavaScriptCSSHTML 
阅读更多 
<HTML>
<HEAD>
	<TITLE>使用EXT输出HelloWorld</TITLE>
	<!-- 导入extjs配置 … ... -->
	<link rel="stylesheet" type="text/css" href="./../ext/resources/css/ext-all.css"/>
	<script type="text/javascript" src="./../ext/adapter/ext/ext-base.js"></script>
	<script type="text/javascript" src="./../ext/ext-all.js"></script>
	<script type="text/javascript">
		Ext.onReady(function(){
			Ext.BLANK_IMAGE_URL='./../ext/resources/images/default/s.gif';
			var panel = new Ext.Panel({
				width: 600,
				height: 500,
				title: '父面板',
				layout: 'accordion',
				renderTo: 'form',
				items:[{
					title: '面板一',
					items:[{title: '子面板1'},{title: '子面板2'},{title: '子面板3'}]
				},{
					title: '面板二',
					items:[{title: '子面板1'},{title: '子面板2'},{title: '子面板3'}]

				},{
					title: '面板三'
				}]
			});
			 	
		});
	</script>
</HEAD>
<body id="form">
</body>
</HTML>
 
分享到：
| 布局之fit布局
评论
发表评论

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

相关推荐

    ExtjS--accordion布局

    在本篇博客中，我们将聚焦于"accordion布局"这一特性，它是ExtJS布局系统中的一种特殊形式。 Accordion布局，又称为折叠面板布局，允许在一个容器内放置多个面板，这些面板会像手风琴一样展开和折叠。这种布局模式...

    accordion-swipe-layout, accordion 针对Android的布局.zip

    accordion-swipe-layout, accordion 针对Android的布局 Android accordion Swipe布局通过iOS邮件应用激发 轻松的accordion 触摸屏布局。 非常容易使用步骤 1 Gradle添加到 root 项目 gradleallprojects {

    extjs4中panel的accordion布局以及treepanel导航

    本文将深入探讨Panel的accordion布局以及TreePanel的动态导航功能，帮助开发者更好地理解和运用这些特性。 首先，让我们关注EXTJS4中的Panel组件。Panel是一个可自定义的容器，用于展示各种内容，如文本、图像、...

    Accordion布局

    Accordion 布局由类Ext.layout.Accordion 定义，名称为accordion，表示可折叠的布局，也就 是说使用该布局的容器组件中的子元素是可折叠的形式。

    Ajax之Accordion控件的用法

    Accordion控件则是这种技术的一个体现，它提供了一种折叠式的布局，使得大量信息可以以紧凑的形式展示，用户可以通过展开和折叠各个部分来查看详细内容。 Accordion控件的基本结构通常包括多个面板（Panel），每个...

    ExtJS 4 复杂 百叶窗(accordion)布局

    ExtJS 4 复杂 百叶窗(accordion)布局

    sencha touch accordion(折叠) 布局

    在Sencha Touch中，`Accordion`布局是一种特殊的布局方式，主要用于展示一系列可折叠的面板，每个面板只显示一个内容区域，用户点击一个面板时，其他面板会自动收起。这种布局方式常用于信息展示、菜单导航等场景，...

    Android-accordion-swipe-layoutAndroid手风琴滑动布局

    在Android应用开发中，"手风琴滑动布局"（Accordion Swipe Layout）是一种常见的用户界面设计，它允许用户展开和折叠视图，以显示或隐藏更详细的信息。这种布局模式通常用于列表或卡片视图中，以提高用户体验，特别...

    accordion

    "Accordion"在IT行业中通常指的是一个...理解和熟练使用Accordion的HTML结构、CSS样式以及JavaScript交互是前端开发者必备的技能之一。通过对提供的文件进行分析，我们可以深入学习和实现各种Accordion的定制化需求。

    AjaxControlToolKit之Accordion控件

    Accordion控件就是其中之一，它在网页上以折叠面板的形式展示信息，用户可以展开或折叠各个面板，非常适合用于展示多级分类或详细信息。 首先，我们来看看Accordion控件的基本概念。Accordion控件允许用户通过交互...

    Silverlight中Accordion组件动态生成示例

    在Silverlight 4版本中，Accordion组件是一个非常有用的UI元素，它提供了类似于折叠面板的布局，用户可以展开和折叠各个部分，以查看或隐藏内容。 Accordion组件的核心特性是其可扩展性，使得开发者可以根据需要...

    jquery accordion tree 菜单栏 框架示例

    jQuery Accordion是一款非常流行的JavaScript插件，用于创建可折叠的面板式布局，常用于构建菜单栏、信息分类或导航结构。在本示例中，我们将深入探讨如何利用jQuery Accordion来构建一个树形菜单栏框架。 首先，让...

    ExtJS4+Accordion+SERVLET/STRUTS2+JSON+Ext.tree.Panel实例

    这个实例结合了多个技术，包括Accordion布局、Servlet、Struts2以及JSON数据交互，以及Ext.tree.Panel组件，以创建一个功能丰富的用户界面。 Accordion布局是ExtJS中的一个布局管理器，它允许在一个区域内组织多个...

    学习ExtJS accordion布局

    Accordion布局是ExtJS中的一种特殊布局方式，它允许在一个容器内展示多个可折叠的面板，每个面板的展开会自动收起其他已展开的面板，从而提供了一种高效的屏幕空间利用机制。 一、Accordion布局的核心概念 ...

    Bootstrap Accordion手风琴选项卡代码

    5. **响应式设计**：Bootstrap Accordion天生支持响应式布局，这意味着在不同设备和屏幕尺寸上，手风琴选项卡会自动调整其显示方式，以适应用户浏览。开发者可以利用Bootstrap的网格系统和其他响应式工具进一步优化...

    jQuery Bootstrap网格布局和列表布局切换代码

    或者，可以考虑使用Bootstrap的`.collapse`和`.accordion`组件来实现更复杂的交互。 总的来说，结合jQuery和Bootstrap的强大功能，我们可以创建出既美观又实用的Web界面，使用户能够在网格布局和列表布局之间自由...

    accordion菜单

    `leftTree.css`是样式表文件，用于定义菜单的外观和布局。这可能包括菜单项的字体、颜色、边距、背景色等，以及展开/折叠状态下的特殊样式。通过CSS，我们可以让菜单看起来更美观，与网站的整体风格保持一致。 在...

    纯 CSS3 实现的窗帘菜单 Accordion

    4. **Flexbox 布局**：Flexbox 使得创建响应式和动态布局变得更加容易，特别是在处理 Accordion 这样的组件时，能够灵活地调整子元素的大小和位置。 5. **Grid 布局**：虽然在窗帘菜单中可能不常用，但在某些复杂的...

    Accordion Panel

    用户可以直接编辑这些源文件，自定义Accordion Panel的颜色、字体、布局以及其他视觉效果。 折叠菜单在网页设计中是非常实用的，尤其是在移动设备上，因为它可以帮助优化屏幕空间，使用户能够更轻松地导航复杂的...

    ASP.NET AJAX控件系列 第2讲 Accordion(Hona)

    Accordion控件的核心功能在于提供一种可折叠的布局，使得用户能够按需查看具体内容。它由一系列的Panel组成，每个Panel代表一个独立的内容区域，通常包含文本、图像或其他HTML元素。用户点击一个Panel的标题时，该...

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