Not signed in (Sign In)

SkillShare - A place to discuss Web Standards and Web Design topics

Categories

Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.

JavaScript / DOM / AJAX: jQuery Help Needed Please!

Bottom of Page

1 to 3 of 3

  1.  
    • CommentAuthorTakaya213
    • CommentTimeOct 13th 2008 edited
     permalink
    Hi

    I am trying to create the following with jQuery.

    I have a menu of images that shows a specified DIV area on the page via the CSS display property. The show/hide part of the buttons works.
    What i can't seem to get to work is have the one that you just clicked on to show as selected. When one enters the page the ready opened content area's button needs to be on the selected state as well.
    The image buttons also need to have a hover effect on them, but the one that is selected doesn't need to change hover state.
    All the images have the same file part "_off" or "_on" depending on the state of the image.

    I hope this makes sense.

    Thanks for any and all help!
    Tak
  2.  permalink
    You could use something like $("showhide").addClass("selected"); and $("showhide").removeClass("selected"); with optional hidden class tied to an onclick event:

    $("showhide").click(function(){
    var $this = $(this);
    if( $this.is('.selected') ) {
    $this.removeClass('selected');
    $this.addClass('hidden');
    }
    else {
    $this.removeClass('hidden');
    $this.addClass('selected');
    }
    return false;
    });

    "showhide" is naturally the ID of your show/hide button. If you have to save state between page loads you'll have to use cookies or some other alternative to store the state values.
  3.  permalink
    Oh, and the aforementioned code should be inside a document.ready function.

    $(document).ready(function(){
    //your toggle function goes in here
    });

1 to 3 of 3

  1.  
Add your comments
    Username Password
  • Format comments as (Help)
 
Back to Discussions Top of Page