Question

Ive got a div thats hidden with .hide and on click opens using .show("slide", { direction: "left" }, 1000); which all works fine, inside of that ive got button that on click triggers the div to be hidden, this is done using

$('.hide-content').click(function () {
     $(".slide-out").hide("slide", {
         direction: "left"
     }, 1000);
});

it works, but once its hidden it opens again and then closes really quickly.. its really odd as i cant see that theres any js causing it.

ive made a fiddle of the problem here – http://jsfiddle.net/vUZuY/ – to replicate it : click OPEN then scroll to the bottom of the opened div and hit hide and you’ll see how it bounces back open after it closes.

Answer 1

Ok, I noticed two problems with this:

1. You were re-binding the hide event every time you opened the div. It looks like you’re loading from another source, though, so this might be fine in your actual implementation.
2. Real Issue: In your markup, you have the “Close” link within and a paragraph within them. Both have the class “hide-content” — so you’ve set it up to fire this event twice. (Once when the is clicked and once when the

   is clicked);

I made a quick edit to your fiddle: http://jsfiddle.net/vUZuY/2/ by giving the a unique id and binding to that.