mouse-enter event function not working in Firefox
<p>I have this image:</p>

<pre><code>&lt;img src="..." class="scroller_poster" alt="Some information about movie"&gt;
</code></pre>

<p>... and I'm trying to display the value in ALT in a DIV elsewhere on my page:</p>

<pre><code>&lt;div class="scroller_movie_data"&gt;&lt;/div&gt;
</code></pre>

<p>... using this function (contained in $(document).ready):</p>

<pre><code>$('.scroller_poster').mouseenter(function() {
    var movie_data = $(this).attr('alt');
    if (movie_data) {
        $('.scroller_movie_data').html(movie_data);
        $(this).mouseleave(function() {
            $('.scroller_movie_data').html('');
        });
    }
});
</code></pre>

<p>This works in all browsers except Firefox and I cannot figure out why. Can somebody shed some light on this please?</p>

<p><strong>NOTE:</strong></p>

<p>The image that gets hovered sits inside a jQuery plugin (<a href="http://www.smoothdivscroll.com" rel="nofollow">SmoothDivScroll</a>), which I believe is causing the problem.</p>

<p>Below is a screenshot on what I am working on, it might help understand what I'm doing. Where it says "Madagascar 3: Europe's Most Wanted (2012)" is where I'm trying to get each hovered ALT value to show.</p>

<p><img src="http://i.stack.imgur.com/mZq0V.png" alt="enter image description here"></p>
