jQuery MiniUI

标题: mini-tabs 子页内容不自动撑满tab页 [打印本页]

作者: lang1165    时间: 2015-3-5 11:19:43     标题: mini-tabs 子页内容不自动撑满tab页

mini-tabs

function showTab(node) {
        var tabs = mini.get("mainTabs");

        var id = "tab$" + node.id;
        var tab = tabs.getTab(id);
        if (!tab) {
            tab = {};
            tab._nodeid = node.id;
            tab.name = id;
            tab.title = node.text;
            tab.showCloseButton = true;


            //这里拼接了url,实际项目,应该从后台直接获得完整的url地址
            tab.url = "WebForm1.aspx";

            tabs.addTab(tab);
        }
        tabs.activeTab(tab);
    }


子页代码:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="YT.Web.UI.WebForm1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
        <script src="Scripts/jquery-1.6.2.min.js" type="text/javascript"></script>
    <script src="Scripts/miniui/miniui.js" type="text/javascript"></script>
    <link href="Scripts/miniui/themes/icons.css" rel="stylesheet" type="text/css" />
    <link href="Scripts/miniui/themes/default/miniui.css" rel="stylesheet" type="text/css" />
    <script src="Scripts/contentjs.js" type="text/javascript"></script>
    <style type="text/css">
        html, body{
            margin:0;padding:0;border:0;width:100%;height:100%;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server" style=" width:100%;">
    <div class="mini-splitter" vertical="true" style=" width:100%; height:100%;">
            <div size="50%" showCollapseButton="true">
    1111<br />
    1111<br />
    1111<br />
    1111<br />
    1111<br />
    1111<br />
    1111<br />
    1111<br />
    1111<br />
    1111<br />
    </div>
    <div showCollapseButton="true">
        22<br />
        22<br />
        22<br />
        22<br />
        22<br />
        22<br />
        22<br />
        22<br />
        22<br />
        22<br />
        22<br />
        22<br />
     </div>        
        </div>
    </form>
</body>
</html>



作者: dforce    时间: 2015-3-5 11:22:57

form设置一下100%高度看看
作者: lang1165    时间: 2015-3-5 12:35:40

dforce 发表于 2015-3-5 11:22
form设置一下100%高度看看

设置了form 高度,子页高度就是浏览器的高度了

作者: lang1165    时间: 2015-3-5 12:44:33

dforce 发表于 2015-3-5 11:22
form设置一下100%高度看看

设置了form高度为100%之后,子页高度超过了tabs高度,子页显示不全,而且不显示滚动条。

我是想实现子页自动适应tabs高度的效果。不知道,是否有方法可以现实。
作者: dforce    时间: 2015-3-5 12:55:10

lang1165 发表于 2015-3-5 12:44
设置了form高度为100%之后,子页高度超过了tabs高度,子页显示不全,而且不显示滚动条。

我是想实现子页 ...

是splitter里面的部分没滚动条吧
那个本身的样式就是overflow:hidden的
你可以修改
.mini-splitter-pane
        {
             overflow:auto;
            }
作者: lang1165    时间: 2015-3-5 13:21:01

dforce 发表于 2015-3-5 12:55
是splitter里面的部分没滚动条吧
那个本身的样式就是overflow:hidden的
你可以修改

谢谢!!!问题解决




欢迎光临 jQuery MiniUI (http://miniui.com/discuss/) Powered by Discuz! X2