SitePoint Sponsor

User Tag List

Results 1 to 6 of 6

Threaded View

  1. #1
    SitePoint Member
    Join Date
    Sep 2011
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question JQuery - open closed indicators - Novice to Ninja book

    This question comes from the book: JQuery: Novice to Ninja
    Chapter 5: 03_open_closed_indicators.
    (see zipped my files.)

    This seems simple, but I'm totally lost with my logic.
    (1) I've filtered the first item to be open when the page is loaded.
    (2) When the first panel is open, the cooresponding open / close indicator (which is simply one small image) points the wrong way, or acts improperly.

    My Question
    What code am i missing that would handle the open/closed arrows appropriately if the first item was open on load?


    My js code

    Code:
    $(document).ready(function(){
    				   
    $( '#menu > li > ul' ) 
    	.click(function( e ){
    		e.stopPropagation();
    	})
    .filter(':not(:first)')
    .hide();
    
      $('#menu > li').toggle(function(){
    	  $(this)
          .css('background-position', 'right -20px')
          .find('ul').slideDown();
      }, function(){
      	$( this )
          .css('background-position', 'right top')
          .find('ul').slideUp();
      });
    });
    I've messed around with the code for way too long and can't figure it out. Any help appreciated.

    Also,(not essential) how easy is it to add an expand / collapse all buttons? Though I have some ideas as to how to approach this.
    Attached Files Attached Files


Bookmarks

Posting Permissions

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