jQuery MiniUI

 找回密码
 立即注册
查看: 6140|回复: 6
打印 上一主题 下一主题

mini-fit和mini-toolber之间div显示隐藏高度计算问题 [复制链接]

Rank: 3Rank: 3

跳转到指定楼层
楼主
发表于 2017-8-29 09:24:19 |只看该作者 |倒序浏览
本帖最后由 Aisin丿Gioro 于 2017-8-29 09:25 编辑

在mini-fit和mini-toolbar之间新增了一个高级查询的div,默认是隐藏的。点击mini-toolbar的高级查询按钮的时候让这个div显示,在点击就隐藏,然后mini-fit高度计算有问题怎么解决?$("#search").click(function () {
      $("#search-box").slideToggle();
      mini.layout();
});


Rank: 8Rank: 8

沙发
发表于 2017-8-29 09:33:34 |只看该作者
应该来说调用一下mini.layout()就可以了,你这里没调整吗?
延时个100毫秒试一下。

Rank: 3Rank: 3

板凳
发表于 2017-8-29 10:09:51 |只看该作者
本帖最后由 Aisin丿Gioro 于 2017-8-29 10:19 编辑
felt 发表于 2017-8-29 09:33
应该来说调用一下mini.layout()就可以了,你这里没调整吗?
延时个100毫秒试一下。 ...

现在计算好像反的呢,点击第一次按钮的时候mini-fit的高度会增加,正常的情况来说div显示出来的时候mini-fit高度会减小,点击第二次的时候div隐藏mini-fit的高度会减小很多。应该是把div的高度也减去了这是没有点击的这是第一次点击的
这是第二次点击的
附件: 你需要登录才可以下载或查看附件。没有帐号?立即注册

Rank: 8Rank: 8

地板
发表于 2017-8-29 10:17:43 |只看该作者
Aisin丿Gioro 发表于 2017-8-29 10:09
现在计算好像反的呢,点击第一次按钮的时候mini-fit的高度会增加,正常的情况来说div显示出来的时候mini-f ...

提供你页面,包括简单代码,重新你的问题。

Rank: 3Rank: 3

5#
发表于 2017-8-29 10:20:54 |只看该作者
felt 发表于 2017-8-29 10:17
提供你页面,包括简单代码,重新你的问题。

<body>
<div class="wrapper bg-gray">
    <div class="mini-toolbar">
        <div class="f-l">
            <div class="btn-group">
                <a class="btn radius" href="${pageContext.request.contextPath}/legal_lawyer/legal_lawyer_add.action" onclick="add()">
                     <i class="fa fa-plus"></i>新增
                </a>
                <a class="btn radius" href="javascript:void(0);">
                    <i class="fa fa-file"></i>查看
                </a>
                <a class="btn radius" href="${pageContext.request.contextPath}/legal_lawyer/legal_lawyer_edit.action">
                    <i class="fa fa-edit"></i>编辑
                </a>
                <a class="btn radius" href="javascript:void(0);">
                    <i class="fa fa-refresh"></i>刷新
                </a>
                <a class="btn radius" id="search" href="javascript:void(0);">
                    <i class="fa fa-refresh"></i>搜索
                </a>
            </div>
        </div>
        <div class="f-r">
            <div id="pager1" class="mini-pager" sizeList="[5,10,20,100]" showPageInfo="false"
                 showReloadButton="false"></div>
        </div>
    </div>
    <div class="row cl mb-15" id="search-box" style="display: none;">
        <div class="col-12">
            <div class="panel panel-default">
                <div class="panel-header">查询条件</div>
                <div class="panel-body"></div>
            </div>
        </div>
    </div>
    <div class="mini-fit">
        <div id="tabs1" class="mini-tabs" tabAlign="top" tabPosition="left" activeIndex="0" style="width:100%;height:100%;" plain="false" buttons="#tabsButtons" buttonsAlign="right">

        <div title="未处理" >
            <div class="mini-datagrid" id="datagrid1" borderStyle="border:0;" showVGridLines="false" allowAlternating="true" showLoading="true" onrowdblclick="assoOrgView" style="width:100%;height:100%;"  idField="id" resultAsTree="false" allowResize="false" pageSize="50"
                 url="${pageContext.request.contextPath}/" multiSelect="true" pager="#pager1" showPager="false">
                <div property="columns">
                    <div type="checkcolumn"></div>
                    <div type="indexcolumn" headerAlign="center" width="40" align="center">序号</div>
                    <div field="" width="100" headerAlign="left" align="left" allowSort="true">姓名</div>
                    <div field="" width="200" headerAlign="left" align="left" allowSort="true">执业机构</div>
                    <div field="" width="150" headerAlign="left" align="left" allowSort="true">执业类别</div>
                    <div field="" width="100" headerAlign="left" align="left" allowSort="true">执业证号</div>
                    <div field="" width="100" headerAlign="left" align="left" allowSort="true">执业状态</div>
                    <div field="" width="100" headerAlign="left" align="left" allowSort="true">派驻状态</div>
                    <div field="" width="100" headerAlign="left" align="left" allowSort="true">手机号码</div>
                    <div field="" width="100" headerAlign="left" align="left" allowSort="true">业务专长</div>
                    <div type="setting" width="100" headerAlign="left" align="left" renderer="reSetting">操作</div>
                </div>
            </div>
        </div>
        <div title="已处理" ></div>
    </div>
    </div>
</div>
    <script type="text/javascript">

        $("#search").click(function () {
            $("#search-box").slideToggle(100);
            mini.layout();
        });

    </script>
</body>

Rank: 8Rank: 8

6#
发表于 2017-8-29 11:05:58 |只看该作者
Aisin丿Gioro 发表于 2017-8-29 10:20
新增
               
          ...

请延时调用mini.layout()
setTimeout(function(){
   mini.layout();
},200)

Rank: 3Rank: 3

7#
发表于 2017-8-29 11:28:51 |只看该作者
felt 发表于 2017-8-29 11:05
请延时调用mini.layout()
setTimeout(function(){
   mini.layout();

可以的谢谢

Archiver|普加软件

GMT+8, 2025-7-10 14:08 , Processed in 1.060334 second(s), 11 queries .

Powered by Discuz! X2

© 2001-2011 Comsenz Inc.

回顶部