如何將課程添加到打開的面板？

任何人都可以幫助我我有兩個面板我在一個頁面上使用，我只想要一次顯示，所以我調整了js，但它似乎沒有添加類。誰能幫忙？如何將課程添加到打開的面板？

 
    $(document).ready(function() { 
     $("div.panel_buttonGal").click(function() { 
      $("div#panelGal").animate({ 
       height: "150px" 
      }).animate({ 
       height: "140px" 
      }, "slow"); 
      $("div.panel_buttonGal").toggle(); 
      $("div#panelGal").addClass("open"); 
     }); 

     $("div#hide_buttonGal").click(function() { 
      $("div#panelGal").animate({ 
       height: "0px" 
      }, "slow"); 
      $("div#panelGal").removeClass("open"); 
     }); 
     $("div.panel_buttonAbt").click(function() { 
      $("div#panelGal.open").animate({ 
       height: "0px" 
      }, "fast"); 
     }); 
    });

HTML看起來像這樣。

<pre><code> 
<div id="panelGal" class=""> 
    <div class="panel_contents"> </div> 
    <ul class="subnav"> 
      <li><a href="#">Engagements & Weddings</a></li> 
      <li><a href="#">Maternity & Newborns</a></li> 
      <li><a href="#">Seniors</a></li> 
      <li><a href="#">Portraits</a></li> 
      <li><a href="#">Photo Parties & Fundraisers</a></li> 
      <li><a href="#">Special Events</a></li> 
      </ul> 
    </div> 

    <div id="panelAbt" class=""> 
    <div class="panel_contents"> </div> 
     <ul class="subnav"> 
      <li><a href="#">Bio</a></li> 
      <li id="invest"><a href="#">Investment</a></li> 
      <li><a href="#">Details (FAQ)</a></li> 
      <li><a href="#">Testimonials</a></li> 
      <li><a href="#">Vendors We Love</a></li> 
      </ul> 
    </div> 

    <div id="nav"> 

     <div class="MainNav"><a href="#" class="rp">Home</a></div> 
     <div class="MainNav"><a href="#" class="rp">About You</a></div> 
     <div class="MainNav panel_buttonGal" style="display: visible;"><a class="rp">Galleries</a></div> 
     <div class="MainNav panel_buttonGal" id="hide_buttonGal" style="display: none;"><a class="rp">Galleries</a></div> 
     <div class="MainNav panel_buttonAbt" style="display: visible;"><a class="rp">About Us</a></div> 
     <div class="MainNav panel_buttonAbt" id="hide_buttonAbt" style="display: none;"><a class="rp">About Us</a></div> 
     <div class="MainNav"><a href="#" class="rp">The Latest</a></div> 
     <div class="MainNav"><a href="#" class="rp">Proof & Shop</a></div> 
     <div class="MainNav"><a href="#" class="rp">Contact Us</a></div> 

    </div> 

</code></pre>

來源

2010-10-25 Ashlee

什麼的HTML是什麼樣子？ – Prozaker 2010-10-25 22:56:23

爲面板添加了html。 – Ashlee 2010-10-25 23:09:11

改爲使用hide()和show()。

來源

2010-10-25 23:11:31

使用show（）hide（）如何？ – Ashlee 2010-10-25 23:23:09

假設你的打開樣式是一個用於顯示的包裝：none，替換$（「div＃panelGal」）。addClass（「open」）;使用$（「div＃panelGal」）。和帶有.hide（）的removeClass。如果你有其他屬性被設置爲這種風格（字體，顏色），使用jQuery將它們設置在可選的function（）參數中 – 2010-10-26 00:25:31

不是添加CSS類和使用動畫（）的，使用slideUp（）和slideDown()：

$(document).ready(function() { 
     $("div.panel_buttonGal").hide(); // initial state 
     $("div.panel_buttonGal").click(function() { 
      $("div#panelGal").slideDown("slow"); 
      $("div.panel_buttonGal").toggle(); 
     }); 

     $("div#hide_buttonGal").click(function() { 
      $("div#panelGal").slideUp("slow"); 
     }); 
     $("div.panel_buttonAbt").click(function() { 
      $("div#panelGal").slideUp("fast"); 
     }); 
    });

來源

2010-10-26 04:14:45 Hollister

如何將課程添加到打開的面板？

回答

相關問題