Using Javascript/JQuery Mouseover fades in Firefox (keeps repeating)
<p>I am trying to use JS/JQuery to make tiles that will fade out then fade in with different data (In this case it is pictures) when you over on it and then reverse it when you mouse off of it. Now my code works fine in Chrome but when I test it in FireFox it keeps executing the fade in/out commands. I looked up similar situations where people use the <code>$(this).stop().fadeOut(function()</code> code but since I am doing multiple fades and loading information it won't do the animation correctly. Does anyone know a solution to this?</p>

<pre><code> &lt;script&gt;
$(document).ready(function()
{
    var hov = false;
    $(".previewBox").mouseenter(function()
    {
        if(hov === false)
        {
            hov = true;
            $(this).fadeOut(function() 
            { 
                $(this).load(function() 
                { 
                    $(this).fadeIn(); 
                }); 
                $(this).attr("src", "Images/Portfolio/Art_Bike_Flip.png"); 
            });
        };
    });

    $(".previewBox").mouseleave(function()
    {
        if(hov === true)
        {
            hov = false;
            $(this).fadeOut(function()
            {
                $(this).load(function()
                {   
                    $(this).fadeIn();
                });
            $(this).attr("src", "Images/Portfolio/Art_Bike_Preview.png");
            }); 
        };
    });
});
&lt;/script&gt;`enter code here`
</code></pre>
