jQuery fader for two contents
I want to fade two contents the same time on one page by clicking a teaser: e.g. click on #teaser2 the contents in #backstage2 and #content2 are fading in the same time.
look at my html
<!-- backstage content is in a separate div -->
<div id="backstage">
<div id="bigpicture1">
<img src="img1.jpg" width="800" height="600" />
</div>
<div id="bigpicture2">
<img src="img2.jpg" width="800" height="600" />
</div>
<div id="bigpicture3">
<img src="img3.jpg" width="800" height="600" />
</div>
</div>
<!-- stage content is also in a separate div -->
<div id="stage">
<div id="content1">
<h2>Loremipsum 1</h2>
<p>Nam liber tempor cum soluta nobis eleifend.<a href="#">mehr ...</a></p>
</div>
<div id="content2">
<h2>Loremipsum 2</h2>
<p>Nam liber tempor cum soluta nobis eleifend.<a href="#">开发者_如何学Cmehr ...</a></p>
</div>
<div id="content3">
<h2>Loremipsum 3</h2>
<p>Nam liber tempor cum soluta nobis eleifend.<a href="#">mehr ...</a></p>
</div>
</div>
<!-- teasers are in a separate div -->
<div id="teaser">
<ul>
<li id="teaser1"><img src="img1_thumb.jpg" alt="" /></li>
<li id="teaser2"><img src="img2_thumb.jpg" alt="" /></li>
<li id="teaser3"><img src="img3_thumb.jpg" alt="" /></li>
</ul>
</div>
I found here "http://www.brightyoursite.com/blog/2010/01/23/nice-jquery-content-slider/" some nice code but works only with one content-DIV... Hope you understand "german-style" english - thanks for your help
Ottmar
Try
$("#backstage2 , #content2").fadeOut();
Although I didn't use suSlider plugin, I think I got the same results as you are looking for but just using jQuery and jQueryUI: http://jsfiddle.net/marcosfromero/K9jNP/
try
jQuery('#teaser2').bind('click', function() {
jQuery('#backstage2 , #content2').fadeOut();
});
DEMO
精彩评论