Question

$(document).ready(function() {
    $("ul li").click(function() {
        $(this).find("p").slideToggle("normal");
        return false;
    });
});

With this piece of jQuery code I can make elements slide in and out. But the problem is that when someone clicks real fast, the slide out will only go until the max height is reached of the latest reached height.

So, if someone would click real fast the element will only slide out a couple of pixels and slide back up. If they´d than click again to slide it out, it will only slide out to the max height it reached the last time.

Can anybody help me to fix this issue to make this work proper?

PS: The height of the p element is set to auto so it automaticly matches the height of the content inside (maybe this detail will help with your answer).

Answer 1

Try this:

$(document).ready(function() {
    $("ul li").click(function() {
        if ( ! $(this).find('p:animated').length)
        {
            $(this).find("p").slideToggle("normal");
            return false;
        }
    });
});