How to combine click with hover function in same status？ [closed]

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center. Closed 11 years ago.

I try to add click function but it doesn't run...

$("#menu2 li").hover(function() { //On hover... 

    $(this).find("span").stop().animate({ 
        marginTop: "-40" //Find the span tag and move it up 40 pixels 
    },开发者_运维技巧 250); 

    $("#menu2 li").click(function() { //On click... 
        $(this).find("span").stop().animate({ 
            marginTop: "-40" //Find the span tag and move it up 40 pixels 
        }, 250); } 
        , function() { //On hover out... 
            $(this).find("span").stop().animate({ 
                marginTop: "0" //Move the span back to its original state (0px) 
            }, 250); 
        }); 
});

here is the link:after click, i hope it still be white color

---

I think you are talking about binding both the hover and click together. Try this:

$('#menu2 li').bind('click hover', function(){

// do stuff

});

---

Update: After seeing your link and reading the explanation, I would do it this way:

Create a CSS class selected:

.selected span {
    marginTop: "-40";
}

Add the class to the element on click and only perform the mouseleave action if the element is not selected:

$("#menu2 li").click(function() {
    if(!$(this).hasClass('selected')) {
        $(this).siblings('.selected').removeClass('selected').mouseleave();
        $(this).addClass('selected');
    }
}).hover(function() {
    $(this).find("span").stop().animate({ 
        marginTop: "-40" //Find the span tag and move it up 40 pixels 
    }, 250); 
}, function() {
    if(!$(this).hasClass('selected')) {
        $(this).find("span").stop().animate({ 
            marginTop: "0" //Move the span back to its original state (0px) 
        }, 250);
    }
});

I created a DEMO for you.

---

Old answer:

It should probably be:

function mouseEnterHandler {
    $(this).find("span").stop().animate({ 
        marginTop: "-40" //Find the span tag and move it up 40 pixels 
    }, 250); 
}

function mouseLeaveHandler() {
    $(this).find("span").stop().animate({ 
        marginTop: "0" //Move the span back to its original state (0px) 
    }, 250);
}

$("#menu2 li").click(mouseEnterHandler)
              .hover(mouseEnterHandler, mouseLeaveHandler);