jQuery effect loads too soon, works inversly

Question

I have an element that, when hovered over, slides up and down. However, if the user happens to have their cursor over the element as the page loads, it sometimes reverses the action, going down and up. This makes it especially difficult for the visitor because the element is constantly disappearing on them when they try to click it.

This is what the snippet of code looks like:

$j('#gallery_holder').hover(function() {

    $j('.gallery_spacer').slideToggle();

});

Answer 1

try wrapping the code you have in the following;

$(document).ready(function () {
//your code
});

Answer 2

There was an answer here previously (don't know where it went) that suggested I use mouseenter() instead of hover(). This seems to be working for me. Since using it, I haven't been able to duplicate the problem so far. Here's what I ended up going with:

$j('#gallery_holder').mouseenter(function() {

    $j('.gallery_spacer').slideUp();

});

$j('#gallery_holder').mouseleave(function() {

    $j('.gallery_spacer').slideDown();

});

All this is placed within:

$(document).ready(function () {

});