Show/hide a div with jquery multiple times?

The best approach is probably going to be something using custom attributes. If you markup your anchor with an attribute that tells the jquery which div to toggle, it will be easier to write generic code to do the work Something like this: script src="" rel="nofollow">ajax.googleapis.com/ajax/libs/jquery/1.3... $(function() { $(". View-code").

Click(function(evt) { var d = $(this). Attr("toolDiv"); $(". Tool_blocktoolDiv=" + d + ", .

View-codetoolDiv=" + d + "").toggle(); }); }); view code hide code this stuff is hidden until we choose to show it!

The best approach is probably going to be something using custom attributes. If you markup your anchor with an attribute that tells the jquery which div to toggle, it will be easier to write generic code to do the work. Something like this: view code hide code this stuff is hidden until we choose to show it!

Then give each of your anchor-div pairs a unique toolDiv value (doesn't have to be a number).

That is exactly what I need! 1 thing is when you click a link it loads the # into the URL, do you know how to cancel out that part because it makes the page go to the very top if you are scrolled down any. Thanks – jasondavis Sep 5 '09 at 20:58 Another thing, do you know if it would be possible to wrap this in a function that I could put away in a file elsewhere and then just call it with a 1 liner on the page I need it?

– jasondavis Sep 5 '09 at 21:00 You can stick the contents of that script block into another file, and as long as it is loaded after the jquery library, it will work fine for any page. No need to write any JS on the page directly. To prevent the default behavior of the anchor, just add return false; to the end of the click handler.

– Joel Potter Sep 5 '09 at 21:05.

If you could wrap the whole collection in a div, it would make it pretty easy. $(function() { $(". View-code").

Click( function(e) { $(this).siblings().andSelf().toggle(); }); }); view code hide code this stuff is hidden until we choose to show it! If it doesn't handle the , you could filter the siblings to only div and anchor elements.

This does require that the anchors and divs be somewhat related in the markup though. – Joel Potter Sep 5 '09 at 20:39 Only that they be in the same container, but it sounds like that's what he's after. – tvanfosson Sep 5 '09 at 20:40 I do think this is an elegant solution, if the assumption you have made is true for the OP.

– Joel Potter Sep 5 '09 at 21:14 Only problem is it won't allow me to have multiple sets. This would allow 1 click event for multiple divs but not multiple sets of click events to alter different div's like Joel Potter's answer – jasondavis Sep 5 '09 at 23:20 @jasondavis -- I'm not sure what you mean. This would apply a handler to every element (in this case anchors) decorated with the "view-code" class.

Each click handler would apply only to the elements in the container with the element that the handler is applied to. You could have as many sets of anchor/anchor/div tuples as you wanted as long as they were wrapped in a div so that you could use the siblings() method to select just those divs and anchors associated with the element clicked on. – tvanfosson Sep 5 '09 at 23:46.

Each element you want shown/hidden can have a class called "toggler," as in: ... You can then toggle the visibility of ALL elements with this class at once, with: $(". Toggler").toggle(); In this scenario, it doesn't make a difference where in the document these elements reside or even what kind of elements they are. If this functionality needs to be available globally, you can always extend jQuery itself with a custom function, as in: $.

ToggleTogglers = function(toggleClass) { $(". " + toggleClass).toggle(); }; This is nice in that you have flexibility to choose a toggle custom class of your own design.

I like this script and am using it. The issue I am running into is that I have three seperate show hides on the page. I have an $aclss $bclss and $clss...I need them to open independently, which I have done so far without issue.

But I need multiple hides at once based on which class is choosen. For example if $aclss $bclss $clss are all shown and I click to hide $bclss, $clss should hide as well. If I click to hide $aclss then $bclss and $clss should hide as well.

Basically anything under the class that is clicked needs to close . Does anyone know how I would do this..Thanks.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.

Related Questions