2013-04-11 2 views
1
나는 JQuery와 아코디언 사용하고

JQuery와 아코디언 :는 높이 문제

<script language="javascript" type="text/javascript"> 
    $(function() { 
     var activeIndex = parseInt($('#<%=hidAccordionIndex.ClientID %>').val()); 

     $("#accordion").accordion({ 
      autoHeight: true, 
      // event: "mousedown", 
      active: activeIndex, 
      change: function (event, ui) { 
//    var index = $(this).accordion("option", "active"); 
    //    $("#<% =hidAccordionIndex.ClientID %>").val(index); 
    } 
     }); 
    }); 
</script> 

그리고 HTML/탭의 높이

 <asp:HiddenField ID="hidAccordionIndex" runat="server" Value="0" /> 
     <div id="kez_header"> 
     <table class="style1"> 
      <tr> 
       <td> 
        <h4> 
         Company Settings 
        </h4> 
       </td> 
       <td align="right" valign="middle"> 
       </td> 
      </tr> 
     </table> 
    </div> 
    <div id="accordion"> 
    <h3>Paymo Credentials</h3> 
    <div> 
     <div class="form-horizontal"> 
       <div class="control-group"> 
           <label class="control-label" for="<%=txtApi.ClientID%>"> 
            API Key</label> 
           <div class="controls"> 
            <asp:TextBox ID="txtApi" placeholder="API Key" runat="server" TextMode="SingleLine" Width="304px"></asp:TextBox> 
           </div> 
          </div> 
          <div class="control-group"> 
           <label class="control-label" for="<%=txtEmail.ClientID%>"> 
            Email</label> 
           <div class="controls"> 
            <asp:TextBox ID="txtEmail" placeholder="Email" runat="server" TextMode="Email" Width="281px"></asp:TextBox> 
           </div> 
          </div> 
          <div class="control-group"> 
           <label class="control-label" for="<%=txtPassword.ClientID%>"> 
            Password</label> 
           <div class="controls"> 
            <asp:TextBox ID="txtPassword" placeholder="Password" runat="server" TextMode="Password" Width="186px"></asp:TextBox> 
           </div> 
          </div> 
          <asp:Button CssClass="btn" ID="btnEditPaymo" runat="server" OnClick="btnEditPaymo_Click" Text="Save Changes" /> 
         </div> 
    </div> 
      <h3>Paymo Settings</h3> 
    <div> 
         <div class="form-horizontal"> 
          <div class="control-group"> 
           <label class="control-label" for="<%=txtFilter.ClientID%>"> 
            Filters</label> 
           <div class="controls"> 
            <asp:TextBox ID="txtFilter" placeholder="Filters (Separate by ';')" runat="server" TextMode="SingleLine" Width="200px"></asp:TextBox> 
           </div> 
          </div> 
          <asp:Button CssClass="btn" ID="btnEditPaymoSettings" runat="server" Text="Save Changes" OnClick="btnEditPaymoSettings_Click" /> 
         </div> 

    </div> 
    <h3>CRM Credentials</h3> 
    <div> 
         <div class="form-horizontal"> 
           <div class="control-group"> 
           <label class="control-label" for="<%=txtCRMOrg.ClientID%>"> 
            Organization</label> 
           <div class="controls"> 
            <asp:TextBox ID="txtCRMOrg" placeholder="Organization" runat="server" TextMode="SingleLine"></asp:TextBox> 
           </div> 
          </div> 
          <div class="control-group"> 
           <label class="control-label" for="<%=txtCrmDomain.ClientID%>"> 
            Domain</label> 
           <div class="controls"> 
            <asp:TextBox ID="txtCrmDomain" placeholder="Domain" runat="server" TextMode="SingleLine"></asp:TextBox> 
           </div> 
          </div> 
           <div class="control-group"> 
           <label class="control-label" for="<%=txtCRMUser.ClientID%>"> 
            Username</label> 
           <div class="controls"> 
            <asp:TextBox ID="txtCRMUser" placeholder="Username" runat="server" TextMode="SingleLine"></asp:TextBox> 
           </div> 
          </div> 
           <div class="control-group"> 
           <label class="control-label" for="<%=txtCRMPassword.ClientID%>"> 
            Password</label> 
           <div class="controls"> 
            <asp:TextBox ID="txtCRMPassword" placeholder="Password" runat="server" TextMode="Password"></asp:TextBox> 
           </div> 
          </div> 
          <asp:Button CssClass="btn" ID="btnEditCRM" runat="server" Text="Save Changes" OnClick="btnEditCRM_Click" /> 
         </div> 

    </div> 
        <h3>CRM Settings</h3> 
    <div> 
         <div class="form-horizontal"> 
          <div class="control-group"> 
           <label class="control-label"> 
            Status Reason Filters</label> 
           <div class="controls"> 
            <asp:CheckBoxList ID="cblCRMStatus" runat="server" CssClass="checkbox"></asp:CheckBoxList> 
           </div> 
          </div> 
          <div class="control-group"> 
          <label class="control-label"> 
            Case Type Filters</label> 
           <div class="controls"> 
            <asp:CheckBoxList ID="cblCRMType" runat="server" CssClass="checkbox"></asp:CheckBoxList> 
           </div> 
          </div> 
          <asp:Button CssClass="btn" ID="btnEditCRMSettings" runat="server" Text="Save Changes" OnClick="btnEditCRMSettings_Click" /> 
         </div> 

    </div> 
    <h3>Work Day Hours</h3> 
    <div> 
         <div class="form-horizontal"> 
          <div class="control-group"> 
           <label class="control-label" for="<%=txtHours.ClientID%>"> 
            Hours</label> 
           <div class="controls"> 
            <asp:TextBox ID="txtHours" placeholder="Hours" runat="server" TextMode="SingleLine" Width="66px"></asp:TextBox> 
           </div> 
          </div> 
          <asp:Button CssClass="btn" ID="btnEditHours" runat="server" OnClick="btnEditHours_Click" Text="Save Changes" /> 
         </div> 

    </div> 
</div> 

나는 이유는 모르겠지만, 패널의 모두 이상하게 보이는 가장 긴 탭. 대신 나는 그들 모두가 그들이 원하는 높이가되기를 바랍니다.

운 좋게도 autoHeight를 사용해 보았습니다.

높이를 생성하는 중입니다

<div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" style="display: block; height: 1339.21875px;" id="ui-accordion-accordion-panel-0" aria-labelledby="ui-accordion-accordion-header-0" role="tabpanel" aria-expanded="true" aria-hidden="false"> 
    <div class="form-horizontal"> 
     <div class="control-group"> 
      <label class="control-label" for="ContentPlaceHolder1_txtApi">API Key</label> 
      <div class="controls"> 
       <input name="ctl00$ContentPlaceHolder1$txtApi" type="text" value="10065f74bdee9f0b7870c1d35f13ad3c" id="ContentPlaceHolder1_txtApi" placeholder="API Key" style="width:304px;"> 
      </div> 
     </div> 
     <div class="control-group"> 
      <label class="control-label" for="ContentPlaceHolder1_txtEmail">Email</label> 
      <div class="controls"> 
       <input name="ctl00$ContentPlaceHolder1$txtEmail" type="email" value="[email protected]" id="ContentPlaceHolder1_txtEmail" placeholder="Email" style="width:281px;"> 
      </div> 
     </div> 
     <div class="control-group"> 
      <label class="control-label" for="ContentPlaceHolder1_txtPassword">Password</label> 
      <div class="controls"> 
       <input name="ctl00$ContentPlaceHolder1$txtPassword" type="password" id="ContentPlaceHolder1_txtPassword" placeholder="Password" style="width:186px;"> 
      </div> 
     </div> 
     <input type="submit" name="ctl00$ContentPlaceHolder1$btnEditPaymo" value="Save Changes" id="ContentPlaceHolder1_btnEditPaymo" class="btn"> 
    </div> 
</div> 
+1

마음이 바이올린이 퍼팅? – Brad

답변