Question

我正在研究jquery slidetoggle，我遇到了类似的问题在第二行到最后一行似乎有一些错误，比如在最小化之后仍然是sapce（该div的高度），尽管div最小化了。任何人都有想法清除那个空间请帮助我。

代码就像

<div id="divRow1" style="width: 750px;">
            <div id="divEmployeeInfo" class="cmIndParent">
                <b class="RoundedBlue"><b class="RoundedOne"></b><b class="RoundedTwo"></b></b>
                <div id="divEmployeeInfoHeader" class="cmIndHeader" onclick="SlideToggle('divEmployeeInfoContent', 'PanelEmployeeState1');">
                    <label style="padding-left:1em; text-align:left">
                        Employee Information
                    </label >
                    <img style="float: right; padding-top: 3px; padding-right: 10px;" src="Images/expand.gif"
                        alt="Show details" />
                </div>
                <div id="divEmployeeInfoContent" class="cmIndContent hide-ui">
                    <br />
                    <uc1:ucEmployeeInfo ID="ucEmployeeInfo1" runat="server"></uc1:ucEmployeeInfo>
                </div>
            </div>
            <div id="divJobInfo" class="cmIndParent">
                <b class="RoundedBlue"><b class="RoundedOne"></b><b class="RoundedTwo"></b></b>
                <div id="divJobInfoHeader" onclick="SlideToggle('divJobInfoContent', 'PanelEmployeeState2');"
                    class="cmIndHeader">
                    <label style="padding-left:1em; text-align:left" >
                        Job Information
                    </label>
                    <img style="float: right; padding-top: 3px; padding-right: 10px;" src="Images/expand.gif"
                        alt="Show details" />
                </div>
                <div id="divJobInfoContent" class="cmIndContent hide-ui">
                    <br />
                    <uc1:ucJobInfo ID="ucJobInfo1" runat="server"></uc1:ucJobInfo>
                </div>
            </div>
            <div id="divEmployer" class="cmIndParent">
                <b class="RoundedBlue"><b class="RoundedOne"></b><b class="RoundedTwo"></b></b>
                <div id="divEmployerHeader" onclick="SlideToggle('divEmployerContent', 'PanelEmployeeState3');"
                    class="cmIndHeader">
                    <label class="cmLabelIndHeader">
                        Employer Information</label>
                    <img style="float: right; padding-top: 3px; padding-right: 10px;" src="Images/expand.gif"
                        alt="Show details" />
                </div>
                <div id="divEmployerContent" class="cmIndContent hide-ui">
                    <br />
                    <uc1:ucCompanyInfo ID="ucEmployer"    runat="server"></uc1:ucCompanyInfo>
                </div>
            </div>
        </div>
        <br />
        <div id="testRow" style="width:750px;padding-top: 1px">
            <div id="divTestCase" style="margin: 5px 5px 5px 5px; float: left; width: 740px;">
                <b class="RoundedBlue"><b class="RoundedOne"></b><b class="RoundedTwo"></b></b>
                <div id="divTestHeader" onclick="SlideToggle('divTestContent', 'TestPanelEmployeeState9');" class="cmIndHeader">
                    <label class="cmLabelIndHeader">
                        Test Information</label>
                    <img style="float: right; padding-top: 3px; padding-right: 10px;" src="Images/expand.gif"
                        alt="Show details" />
                </div>
                <div id="divTestContent" class="cmIndContent hide-ui">
                Hello
                </div>
            </div>
        </div>

第一行包含3列div完美工作，第二行只包含一行。我正在使用带有jquery的asp.net c＃

此致亚历

Answer 1

空间究竟有多高？你隐藏之前div有多高？它可能与你在div divTestCase周围设置的5px余量有关，这是你试图隐藏的div的容器。

jQuery SlideToggle最小化后留下空间

1 个答案: