Question

I’m trying to use mouseenter and mouseleave to start and stop a color animation function, however it doesn’t stop on mouseleave…please help me figure out:

A: If mouseenter/leave is the correct event to call (or should I be using mouseover or hover?)

B: The correct structure for using .stop to end a function

<script>
    $(document).ready(function() {
        $("#logo").bind('mouseenter', function() {
            pixelColors() });

        $("#logo").bind('mouseleave', function() {
            pixelColors().stop(true, true); });
    });
</script>

Answer 1

Interstellar_Coder has it right; you need to call stop on a jquery object; try replacing pixelColors in your callback function with jQuery(this), i.e. jQuery(this).stop(true, true);