Bouncing DIVs in Firefox

Bouncing DIVs in Firefox

Hi All,

I'm wondering if someone can point me in the right direction.

I have the following structure

<h2/>
<divbody/>
... repeat...

Basically when the user mouseovers the H2, then the divbody is made visible (Jquery show('fast')). When they mouseleave, then it animates in the opposite direction hiding it.

This works fine in IE, Chrome and Opera, however, in Firefox, the animation gets into a loop and looks like a yo-yo (divs going up and down in long loops). It's as though FF is catching the mouse events mutliple times.

Can someone please advise if there's a way to stop this? Perhaps a way to clear all remaining queued events on an object?

Thanks very much in advance,


Damien




/// <reference path="../Javascripts/jquery-1.2.6.js" />

function ExtractBodyIDFromHead($x,$replace) {
    return $replace + $x.substring(5, $x.length);
}

function hideBlocks() {
    $(".sesbody")
    .css("display", "none");


    $(".seshead").bind("mouseenter", function(e) {
        var $id = $(this).attr("id");
        $("#" + ExtractBodyIDFromHead($id, 'body_')).show("fast");
    })

    $(".seshead").bind("mouseleave", function(e) {
        var $id = $(this).attr("id");
        $("#" + ExtractBodyIDFromHead($id, 'body_')).hide("fast");
    })
}