Ext.onReady(function() { var i = 0; var tabCenter = new Ext.TabPanel( { region : 'center', margins : '0 0 0 0', id : 'tab_view', activeTab : 0, //tabWidth : 135, resizeTabs: true, minTabWidth: 120, enableTabScroll : true, defaults : { xtype : 'panel', closable : true }, items : [ { iconCls : 'smt-welcome', title : '桌面', id : 'btnAlert', closable : false, html : '模块' } ], bbar : [ { text : '添加选项', handler : function() { var id = 'tab' + i; tabCenter.add( { title : '子面版' + i++, id : id, //html: '<iframe name="centerF" frameborder="0" width="100%" height="100%" src="grid.jsp"/>' html: '<iframe name="centerF" frameborder="0" width="100%" height="100%" src="http://www.baidu.com"/>' //autoLoad:'grid.jsp' }); tabCenter.setActiveTab(id); } } ] }); var naveAccordion = new Ext.Panel( { title : '导航栏', layout : 'accordion', region : 'west', iconCls : 'menu_panel', width : 180, height : 400, collapsible : true, margins : '0 0 0 0', animCollapse : false, animFloat : false, split : true, items : [ { title : 'Panel 1', iconCls : 'smt-administrator', html : '<p>Panel content!</p>' }, { title : 'Panel 2', iconCls : 'smt-administrator', html : '<p>Panel content!</p>' }, { title : 'Panel 3', iconCls : 'smt-administrator', html : '<p>Panel content!</p>' } ] }); var viewport = new Ext.Viewport( { layout : 'border', title : 'Border Layout', layout : 'border', items : [ { region : 'north', margins : '0 0 0 0', border : false, height : 25, bbar : [ { iconCls : 'smt-administrator', text : 'admin' }, '-', { iconCls : 'smt-systemTime', id : 'theCurrentTime' }, '->', { text : '退出', iconCls : 'smt-exit', handler : function() { window.location.href = '<%=path%>/admin/to_login'; } } ] }, naveAccordion, tabCenter ] }); });
相关推荐
mPass 定制某一个页面导航栏样式(页面加载后)
给页面导航栏选中栏目添加特殊样式的案例(页面刷新或者跳转到新页面后导航栏的样式仍然有效)
mPass 定制 H5 页面导航栏默认样式
js实现页面导航条(打包下载)
Javascript网页特效(1)QQ式页面导航栏 页面打开后,在页面的左侧有一个类似QQ的可伸缩页面导航,鼠标停留后可打开相应的页面,你可以在设计中对其合适地安置。txt文件是JavaScript的源代码
根据配置JSON生成页面导航栏(注意:采用页面绝对定位 position:absolute,需要与页面布局配合使用),配置数据如下: navData={ logoImg:"../assets/img/mysql.png", name:"MySQL管理工具", navArr:[ {...
自定义导航控制器,支持两个页面导航栏颜色动态变化,支持滑动返回区域设置
mPass 设置所有 H5 页面导航栏默认样式
定制某一个页面导航栏样式(页面加载前)
mPass JSApi控制 H5 页面导航栏样式和内容
这是一个运行在AS上的project,里面是点击导航栏切换页面的三种方式的moudle
这是开发爱好者做的导航效果,比android本身的ActionBar效果好,很多国内软件开发商都在用。
自定义tabBar页面的顶部导航栏,并保持导航栏的风格与其他tabBar页面导航栏风格统一,也就是导航栏标题文字排版统一。
几个经典的导航条,css+div+js写的,个人收集
在html页面中加载createNav.js,同时修改navData,在页面即可自动生成到导航栏;navData格式如下: var navData={ logoImg:"../assets/img/mysql.png", name:"MySQL管理工具", navArr:[ {id:"nav3",img:"....
assets为菜单栏、导航栏生成样式的使用案例,打开mainfunciton.html页面可查看; 备注:代码实在jQuery基础上编写的,用户可通过编辑对应的js中json数据,即可在页面上生成对应的样式;代码中使用的图片,需要自行...
点击导航栏,页面不跳转,刷新内容,类似AJAX
利用本类可以快速生成导航条,并且可以被baidu 搜索到. 希望大家喜欢.总共包含三个文件.
想要让导航栏、侧边栏变为公共页面,则要在App.vue页面中加入。假设已经有了Header.vue和Left.vue,这里就不贴出来了,App.vue代码如下: <!-- 其他页 --> <!-- 导航栏 --> <header></header...
这是一个网站前端,在同一页面,导航切换道不同分页面。用到bootstrap框架,不需要CSS、JS文件。将文档复制即可使用。