我希望每個菜單項都展開並顯示不同的內容,我有一個菜單項正在工作。但我想能夠點擊菜單項2將關閉當前展開的div,然後展開一個新的div。當我點擊每個菜單項時,每個內容div都會打開。展開div以顯示不同的內容
繼承人我用什麼來顯示歡迎內容的內容。
jQuery(function($) {
var open = false;
$('.slide_button_welcome').click(function() {
if(open === false) {
$('.slide_welcome').animate({ height: '100%' }
, 400, 'easeOutCirc');
$(this).css('backgroundPosition', 'bottom left');
open = true;
return false;
} else {
$('.slide_welcome').animate({ height: '0px' }
, 400, 'easeOutCirc');
$(this).css('backgroundPosition', 'top left');
open = false;
return false;
}
});
});
在此先感謝,任何幫助將是巨大的。
繼承人的HTML參照上述部分進口:
<!-- BEGIN #primary_nav -->
<div id="primary_nav">
<div id="primary_nav_wrap">
<nav>
<ul>
<li><a class="slide_button_welcome" href="#">Welcome</a></li>
<li><a href="#">News</a></li>
<li><a class="slide_button_gallery" href="#">Gallery</a></li>
<li><a href="#">Bridal</a></li>
<li><a href="#">Shop</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</div>
</div>
<!-- End #primary_nav -->
<!-- BEGIN #slide_container -->
<div id="content_slider">
<!-- BEGIN Welcome -->
<div class="slide_welcome">
<div class="slide_inner">
<h1>Gill Clement</h1>
<p>Gill designs and creates her jewellery from her studio outlet in the village of Mumbles, set at the Western end of Swansea Bay. A Jewellery Graduate from London’s Sir John Cass School of art in 1982, Gill came away with a reputation for innovation and experiment, constantly exploring the cutting edge and pushing boundaries of the profession that has become her life.
</p>
<p>Gill’s work has been recognised and heraled throughout her career, with extensive sales worldwide, from London to New york to Japan.
Examples of Gill’s work can be found in permanent collections
at the Museum of Wales, Birmingham City Art Gallery and the
Contemporary Arts Society.</p>
</div>
</div>
<!-- End Welcome -->
<!-- BEGIN Gallery -->
<div class="slide_gallery">
<div class="slide_inner">
<h1>Gallery</h1>
<p>Lorem ipsum dolor sit amet consectetuer adipi scing elit, sed diam non numy nibh euismod tempor incidunt ut labore et dolore mahna ali quam erat volupat ostrud exerci tatiuon ullamcorper suscipit laboris nisl ut aliquip ex ea com modo consequat. Duis autem novel seum irure dolor in henderit.</p>
<!-- BEGIN jCarousel -->
<ul id="mycarousel" class="jcarousel-skin-tango">
<li>
<a href="#">
<span class="post-thumb-overlay"></span>
<img src="img/gallery/gallery_thumb_01.jpg" alt="" width="224px" height="360px" />';
</a>
</li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<!-- End jCarousel -->
</div>
</div>
<!-- End Gallery -->
</div>
<!-- End #slide_container -->
你能提供的HTML? –