SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Guru
    Join Date
    Jan 2007
    Posts
    967
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Conditional actions inside jquery slide up

    The code below is for a drop down menu. I would like the class "hoverstate" to be removed after the slideUp is completed. The code below works, but it doesn't trigger on main links that don't have a child menu.

    Code:
    $(this).find('ul').slideUp('fast', function(){
            $(this).find('a').removeClass('hoverstate');
    	$(this).css('z-index','1');
    });
    The logic should be something like this:
    Code:
    [ if this has children]
    					
          $(this).find('ul').slideUp('fast', function(){
                  $(this).find('a').removeClass('hoverstate');
           	      $(this).css('z-index','1');
           });
    
    [/ if ]
    
    [ else ]
    
            $(this).find('a').removeClass('hoverstate');
    	$(this).css('z-index','1');
    
    [/ else ]
    I would include a link to the page, but it is password protected. Does anyone know how this syntax would be written?

    Full code excerpt.
    Code:
    $('header.layout li').hoverIntent( 
    		
    			function(){
    				$(this).find('ul').slideDown('fast');
    				$(this).find('a').addClass('hoverstate');
    				$(this).find('li li a').removeClass('hoverstate');
    				$(this).css('z-index','999');
    			},
    			
    			function(){
    			
    				console.log($(this).find('ul').length);
    				
    					$(this).find('ul').slideUp('fast');
    					$(this).find('a').removeClass('hoverstate');
    					$(this).css('z-index','1');
    			}
    			
    		);
    Thank you
    E
    Last edited by eruna; Aug 21, 2013 at 14:55. Reason: Improve formatting

  2. #2
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,890
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    Hi,

    Without any HTML, it's a bit hard (for me at least) to be able to answer your question.

    Maybe you could use this template to produce an example I can run in my browser.

  3. #3
    Non-Member
    Join Date
    Feb 2012
    Posts
    892
    Mentioned
    10 Post(s)
    Tagged
    0 Thread(s)
    Remove the class first, then added it. And remove it by finding it wherever, using its class.

    Quote Originally Posted by eruna View Post
    T
    Code:
    $('header.layout li').hoverIntent( 
    		
    			function(){
    				$(this).find('ul').slideDown('fast');
                                    $('.hoverstate').removeClass('hoverstate');
    				$(this).find('a').addClass('hoverstate');
    				$(this).css('z-index','999');
    			},
    			
    			function(){
    			
    				console.log($(this).find('ul').length);
    				
    					$(this).find('ul').slideUp('fast');
    					$('.hoverstate').removeClass('hoverstate');
    					$(this).css('z-index','1');
    			}
    			
    		);


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
  •