`
血色-浪漫
  • 浏览: 8005 次
  • 性别: Icon_minigender_2
  • 来自: 青岛
社区版块
存档分类
最新评论

easyui layout 折叠后显示标题

阅读更多
(function($){
    var buttonDir = {north:'down',south:'up',east:'left',west:'right'};
    $.extend($.fn.layout.paneldefaults,{
        onBeforeCollapse:function(){
            /**/
            var popts = $(this).panel('options');
            var dir = popts.region;
            var btnDir = buttonDir[dir];
            if(!btnDir) return false;
            setTimeout(function(){
                var pDiv = $('.layout-button-'+btnDir).closest('.layout-expand').css({
                    textAlign:'center',lineHeight:'18px',fontWeight:'bold'
                });
              if(popts.title){
                    var vTitle = popts.title;
                    if(dir == "east" || dir == "west"){
                        var vTitle = popts.title.split('').join('<br/>');
                        pDiv.find('.panel-body').html(vTitle);
                    }else{
                        $('.layout-button-'+btnDir).closest('.layout-expand').find('.panel-title')
                        .css({textAlign:'left'})
                        .html(vTitle)
                    }
                  }   
            },100);           
        }
    });
})(jQuery);
分享到:
评论

相关推荐

    esayui layout

    "EasyUI Layout" 是 EasyUI 中的一个核心组件,用于实现页面的布局管理。下面我们将深入探讨 EasyUI Layout 的相关知识点。 1. **Layout 基本概念**: EasyUI Layout 是一种灵活的布局解决方案,它允许开发者将...

    有关easyui-layout中的收缩层无法显示标题的解决办法

    总结一下,解决EasyUI布局中收缩层无法显示标题的方法是: 1. 更新`jquery.easyui.min.js`到指定版本(如1.4.1)。 2. 在`_39d`方法内,保存面板折叠前的标题和图标信息。 3. 在设置面板属性的地方,将标题和图标...

    easyui layout+tab+tree实现网站基本布局

    EasyUI的tree组件支持多种操作,如展开/折叠节点、选择节点、异步加载数据等。创建tree时,我们需要提供JSON格式的数据源,这些数据描述了树的结构。然后,在HTML中定义tree容器,并使用JavaScript初始化tree,设置...

    easyui折叠菜单写法

    ### easyui折叠菜单写法详解 #### 一、easyUI框架简介 EasyUI是一个基于jQuery的用户界面插件集合库,它提供了丰富的UI组件供开发者使用,这些组件可以帮助开发者快速构建用户界面。EasyUI简化了复杂的JavaScript...

    jQuery EasyUI 中文API—Layout(Panel)

    Layout(布局)是 jQuery EasyUI 中的一个核心组件,它允许我们在网页上创建复杂的布局结构,方便地管理和组织页面内容。在本篇文章中,我们将深入探讨 jQuery EasyUI 中的 Layout(面板布局)及其相关API。 Layout...

    EasyUI tutorial 中文版 chm

    使用easyUI创建折叠面板 使用easyUI创建Tabs标签 使用easyui创建tabs组件和动态添加 使用easyUI创建一个自动播放的tabs 使用easyUI创建XP风格左侧面板 DataGrid 使用easyUI转换HTML table到datagrid ...

    easyui1.7中文api

    - **树形结构(Tree)**:呈现层次结构的数据,支持展开、折叠、选择等操作。 - **按钮(Button)**:包括普通按钮、链接按钮、复选按钮、单选按钮等,可触发各种事件。 3. **布局组件** - **布局(Layout)**:...

    EasyUI1.4+zTree3.5.16完美结合框架布局

    zTree支持多种操作,如节点的展开、折叠、选择、拖放等,同时提供了丰富的回调函数和配置选项,允许开发者定制各种交互行为。zTree在数据管理方面也很灵活,它可以处理动态加载和异步数据源,非常适合构建如文件系统...

    jquery easyui 帮助文档

    jQuery EasyUI 的核心在于其组件系统,这些组件包括但不限于数据网格(datagrid)、下拉菜单(combobox)、对话框(dialog)、表单(form)、布局(layout)、菜单(menu)、面板(panel)、进度条(progressbar)、...

    jQuery_EasyUI中文帮助手册_jqueryeasyui_easyui_

    jQuery EasyUI 是一款基于 jQuery 的前端开发框架,它简化了网页用户界面的构建,提供了丰富的组件和主题,使得开发者能够快速地创建出美观且功能强大的Web应用。本手册旨在为学习和使用jQuery EasyUI的用户提供详尽...

    jquery.easyui.min

    标题“jquery.easyui.min”暗示了这是一个经过压缩优化的jQuery EasyUI的核心库文件,名为“jquery.easyui.min.js”,它的大小被最小化,以提高网页加载速度,降低服务器负载。 EasyUI 提供的主要功能包括:布局...

    EasyUI常用控件使用案例

    首先,`layout`是EasyUI的核心布局控件,它允许开发者将页面分割成多个区域,方便地组织和管理内容。`layout`提供了多种布局模式,如`north`、`south`、`east`、`west`和`center`,可以灵活调整各个区域的大小和位置...

    jquery-easyui-1.2.5

    &lt;div id="layout" class="easyui-layout" style="width:100%;height:400px;"&gt; &lt;!-- 添加子组件的代码 --&gt; $(function () { $('#layout').layout(); }); ``` 以上就是关于 "jquery-easyui-1.2.5" 的核心...

    easyui1.4中文文档

    EasyUI还提供了栅格布局(grid layout)和流式布局(flow layout),方便地调整元素的位置和大小。 11. **数据绑定** EasyUI 支持数据绑定,可以将表单字段与模型数据关联,实现数据的自动同步和验证。 12. **...

    jquery_easyui 中文手册

    easyui-layout:布局组件** 布局(Layout)组件用于创建复杂的页面布局,可以划分成多个区域,如上、下、左、右、中心等。`$("#element").layout`方法用于创建和管理布局。 **14. easyui-menu:菜单组件** 菜单...

    jquery-easyui-1.3.6+文档

    8. **布局(Layout)**:EasyUI的Layout组件用于创建复杂的页面布局,它可以划分区域并动态调整大小。 9. **表单组件**:EasyUI还包含一系列表单组件,如文本框(textbox)、复选框(checkbox)、单选按钮(radio)...

    easyui的demo的所有效果截图,并附上easyui的demo

    EasyUI 提供了多种组件,如对话框(dialog)、表单(form)、菜单(menu)、面板(panel)、布局(layout)、树形控件(tree)、表格(datagrid)、下拉选择框(combobox)等。这些组件设计简洁,且具有良好的用户...

    Jquery之easyui超全示例

    6. **布局(Layout)**:布局组件允许你将页面划分为多个区域,可以自由调整大小和位置,非常适合构建复杂的仪表板。 7. **树形视图(Tree)**:树形视图用于展示层级结构的数据,可以进行展开、折叠、选择等操作。...

    easyui包,有中文介绍

    3. **面板(Panel)**:用于组织内容的基本容器,可以包含标题、工具栏和可折叠的区域。 4. **表单(Form)**:提供了一系列表单控件,如文本输入框、下拉选择、复选框、单选按钮等,支持数据验证和表单提交。 5. ...

Global site tag (gtag.js) - Google Analytics