jQuery slide Toggle Best Solution.

[Attila Hajzer]

Whats the best solution for completing this: http://app4.websitetonight.com/projects/2/3/9/4/2394058/Tools_for_Web_Success2.html

the website I’m working on.

scroll down a bit and click the H4 there’s a hidden content that slides out.

but when multiple on page, it unfolds them all. whats my best option.

the reason it opens both is because their both set to the same ID’s. and i know that if i set all divs different ID’s it will work. BUT what are my other options? are there any other options?

here’s the code:

http://jsfiddle.net/attilahajzer/zx2dk/2/

Please Help.

[sheepysheep60]

Hey man!

So, the way I’d go about this is wrap your pairs of triggers and text in divs. I.E.

Interested




TO PROMOTE JUST YOUR OWN BUSINESS

So, now all we need to do is, find the clicked element (in jQuery, $(this)), find its parent (parent()!) then find its children (children()) but of the class expand (so that becomes children(“.expand”) and then use that variable as the target in the Toggle, BOOM.

$(document).ready(function(){

$(".click").click(function(){



var target = $(this).parent().children(".expand");

$(target).slideToggle();

});

});

Hope this helps, Dave

Link: http://jsfiddle.net/sheepysheep60/qdsW8/

[hoamca]

I tested too, it works fine. trick is wrapper

[sheepysheep60]

Look at your code! You call the .click function about 4 times. So it opens, closes, opens closes AHGHHHHH!!

$(document).ready(function() {



$(".click").click(function() {



$(".expand").slideToggle();



});



});

You only need ONE of those click(function blocks

Dave

[GennaroDiFiandra]

Hi, thank’s for this script.

Is possible to make it add a CSS class to H4 when the box is open? The goal is to change the background of H4 when the box is open.

Thank’s in advance for you help :-)

[Author]

Posts