Extjs4.2 tabPosition left 相关
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>測試</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="/app/ext-4.2.1/ext-all.js"></script>
<script type="text/javascript" src="/app/ext-4.2.1/ext-lang-zh_CN.js"></script>
<link rel="stylesheet" type="text/css" href="/app/ext-4.2.1/resources/ext-theme-neptune/ext-theme-neptune-all-debug.css" /> <style type="text/css">
.verticaltab .x-tab-wrap {
position: absolute;
display: block;
padding-left: 20px;
transform: rotate(90deg);
} .verticaltab .x-tab-button {
position: absolute;
display: block;
padding-left: 0px;
padding-top: 2px;
} </style>
<script type="text/javascript">
Ext.onReady(function(){
Ext.define('VerticalPanel', {
extend : 'Ext.tab.Panel',
cls : 'verticaltab',
// 添加tabbar,修改 背景的宽度
tabBar : {
width : 100,
minTabWidth : 100,
maxTabWidth : 100,
height : 15,
orientation : 'vertical'
}, tabPosition : 'left',// 竖形排列
width : '100%',
height : 300,
enableTabScroll : true,
activeTab : 0,
items : [ {
title : 'panel01',
html : '11111'
}, {
title : 'panel02',
html : '2222222'
}, {
title : 'panel03',
html : '333333333'
} ]
});
var p = Ext.create('VerticalPanel');
p.render('content');
});
</script>
</head>
<body>
<div id="content"></div>
</body>
</html>
Extjs4.2 tabPosition left 相关的更多相关文章
- extjs4学习-02-导入相关文件
在WebContent下创建extjs4目录. 将extjs项目文件中的resource文件夹和ext-all.js.ext-all.js.ext-all-debug.js文件拷贝进去.
- 嵌入式单片机STM32应用技术（课本）
目录SAIU R20 1 6 第1页第1 章. 初识STM32..................................................................... ...
- ExtJs4 笔记（4） Ext.XTemplate 模板
ExtJs4 笔记(4) Ext.XTemplate 模板 摘自:http://www.cnblogs.com/lipan/ 本篇将涉及到ExtJs中一个重要的概念,模板.话说Razor很神奇,但是我 ...
- ExtJS4.2.1自定义主题（theme）样式详解
(基于Ext JS 4.2.1版本) UI组件 学习ExtJS就是学习组件的使用.ExtJS4对框架进行了重构,其中最重要的就是形成了一个结构及层次分明的组件体系,由这些组件形成了Ext的控件. Ex ...
- ExtJS4.2学习(五)表格渲染与复选框
鸣谢:http://www.shuyangyang.com.cn/jishuliangongfang/qianduanjishu/2013-11-10/174.html --------------- ...
- Extjs-4.2.1（一）——编辑 hello word
前言:在搭建好环境后,就可以利用Extjs进行开发了. 一.在项目中拷贝相关的Extjs文件,如下图: 注意:不需要整个Ext开发包全部导入,这样很容易造成eclipse卡死,因为eclipse会自动 ...
- Extjs4学习
1 Ext js初步 1.1 获取Extjs 下载extjs: 可以从http://extjs.org.cn/ 获得需要的extjs发布包及更多支持. 1.2 搭建学习环境: 假设您的机器已经安装my ...
- ExtJS4.2.1
ExtJS4.2.1 1. 介绍 1.1 说明 ExtJS是一个用javascript.CSS和HTML等技术实现的主要用于创建RIA即富客户端,且与后台技术无关的前端Ajax框架. 常用于企业内部管 ...
- Extjs4.0.7 实现Grid的嵌套
网上相关资料非常少,我看过的大多是Extjs 3.0 急以前版本的解决方案. 比如:http://mikhailstadnik.com/ext/examples/nested-grid.htm (E ...
随机推荐
- JavaSE---NIO
1.概述 1.1 BIO的问题: 读取输入流中的数据时,如果没有读到有效数据,该线程将被阻塞: 传统输入.输出流都是阻塞式的: 传统的输入.输出流都是通过字节移动处理: 面向流的输入.输出一次只能处理 ...
- MySQL · 引擎特性 · InnoDB index lock前世今生
http://mysql.taobao.org/monthly/2015/07/05/ MySQL · 引擎特性 · InnoDB index lock前世今生 前言 InnoDB并发过程中使用两类锁 ...
- 使用WindowsAPI播放PCM音频
这一篇文章同上一篇<使用WindowsAPI获取录音音频>原理具有相似之处,不再详细介绍函数与结构体的参数 1. waveOutGetNumDevs 2. waveOutGetDevCap ...
- linux命令strings
linux命令strings,其man信息如下:strings(1) GNU Development Tools ...
- js获取日期：前天、昨天、今天、明天、后天
前天,昨天,今天,明天,后天 <html> <head> <meta http-equiv="Content-Type" content=" ...
- win8中如何设定editplus为txt默认打开程序
设定EditPlus为TXT默认打开方式吧. 首选,打开我们的EditPlus 接着,点击[工具]菜单,点击[参数设置]这个菜单项 来到设定界面 找到[设置&语法]这个选项,然后可以看到里面有 ...
- Hibernate课程 初探多对多映射3-1 课程总结
如何通过添加中间表实现多对多? 1 在双方实体中添加一个保存对方的集合. 2 在双方映射文件中 使用<set>和<many-to-many>元素进行关联关系配置(注意此处)
- elasticsearch复杂查询-----2
1.多条件查询 1)查询索引weibo下字段date大于或等于2015-09-05和name为Mary Jone的数据 2.简单查询 1)查询包含2014字符的数据 2)查询包含字符2014-09-1 ...
- Bootstrap知识点梳理
- Python人工智能之初识接口
本节需要的两个工具: 1.FFmpeg: 链接:https://pan.baidu.com/s/1jonSAa_TG2XuaJEy3iTmHg 密码:w6hk 2.baidu-aip: pip ins ...