实用ExtJS教程100例-007:ExtJS中Window组件最小化

简介:

在上一节中我们演示了如何使用ExtJS的Window组件,这篇内容中我们来演示一下如何将窗口最小化。

要让ExtJS标题栏中显示最小化按钮并不麻烦,只需要设置 minimizable: true 即可。但是显示了最小化按钮,点击的时候却没有任何反应。这是因为ExtJS没有处理最小化事件,需要我们自己来定义最小化按钮被点击时的操作。

Ext.onReady(function () {
    var g_win = Ext.create("Ext.window.Window", {
        title: "标题 - www.qeefee.com",
        height: 200,
        width: 400,
        layout: "fit",
        modal: true,
        closable: false,
        minimizable: true,
        animateTarget: "btn1",
        listeners: {

        },
        html: "<h2>最小化窗口演示</h2>"
    });

    Ext.get("btn1").on("click", function () {
        g_win.show();   //显示窗口
    });
});

要想将窗口最小化,需要处理最小化事件。上面标记的代码就是为window添加最小化事件,处理方法是将窗口隐藏。




本文转自齐师傅博客园博客,原文链接:http://www.cnblogs.com/youring2/p/extjs-100-examples-window-minimize.html,如需转载请自行联系原作者

相关文章
|
JavaScript
Vue框架Element UI教程-出现和隐藏动画(三)
Vue框架Element UI教程-出现和隐藏动画(三)
104 0
|
Web App开发 JavaScript API
layer官方演示与讲解(jQuery弹出层插件)
1. 使用layer遇到困难?Fly社区虔诚为您解惑 2. layer 2.0 发布,以独立形式呈现的最后一个版本 3. Fork layer on Github,爱她,就给她加个星啵 当前版本:2.0(2015-09-01更新) ://github.com/sentsin/layer 大小:40KB,下载次数:124689 一些唠叨 在线调试 快速上手 前往旧版1.8.5 layer是一款近年来口碑极佳的web弹层组件,她具备全方位的解决方案,致力于服务各水平段的开发人员,您的页面会轻松地拥有丰富友好的操作体验。
1722 0
|
Web App开发 JavaScript 容器
|
JavaScript 前端开发
《jQuery、jQuery UI及jQuery Mobile技巧与示例》——7.1 技巧:使用折叠菜单微件组织内容
代码清单7-1介绍了折叠菜单(accordin)微件,通过它,可以将内容分组在标题下面,并且每次只显示选定的一组内容。单击另一个标题会关闭当前打开的一组内容然后在选定的标题下展开新的分组。
1722 0
|
JavaScript 前端开发
《jQuery、jQuery UI及jQuery Mobile技巧与示例》——9.16 技巧:使用主题来更改配色方案
第20行更改了header的主题。然而,在header中的按钮(第24行)却拥有不同的主题。类似地,content拥有的是默认主题,第29~34行中的所有按钮的主题都不一样。甚至组合在一起的按钮也可以有不同的主题,如第39~43行所示。
1570 0
|
JavaScript
ExtJS学习(二)Ext组件模型
Ext中所有的组件都继承自Ext.component,这种单根继承的模型保证所有组件都拥有相同的通用方法与生命周期,这样在后续对这些组件进行维护管理时将更加便捷,同时也保证了在进行布局时的便利。
643 0