Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 1 of 1
  1. #1
    met
    met is offline
    Regular Coder
    Join Date
    Oct 2009
    Location
    United Kingdom
    Posts
    728
    Thanks
    4
    Thanked 119 Times in 119 Posts

    click anchor, display relevant <div>

    hi

    currently I'm using:

    Code:
    $("a#test").live("click",function() {
    	$('div#test').toggle("fast");
    	$(this).css("border-bottom", "1px solid #813563")
    
    });
    Code:
    <a href="#" class="test">Show Test</a>
    <div id="test">Test..</div>
    when I click the link, test div shows.

    I'd like to have 4-5 links on the page, that, when clicked, show content for the appropriate div.

    I was intending to copy and paste the above code and adjust the ID each time, but this seems so inelegant

    is there a better way to achieve this? Assuming each link and its div share an ID or class.

    so:

    test1 link > show test1 div
    test2 link > show test2 div

    i'd also like to hide every other div, so only one is on display at a given time.

    hope this makes sense, thanks.








    resolved

    http://stackoverflow.com/questions/1...657171#1657171

    Code:
    $(document).ready(function() {
      $('.item > p > a').click(function(){
              $('#details > div').hide(); // hide all of the divs
              $('div.' + this.id).show("slow"); // then show the one with the 
    //same class as the link.id that was clicked
           });
    });
    Last edited by met; 11-11-2009 at 01:16 PM.


 

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •