0

In the following code, the animate() function in click() works. However, animate() or pulse() (when uncommented) in mouseenter() does not work either. The pulse() function is provided by Jarrod Overson...

http://jarrodoverson.com/static/demos/jquery.pulse.html

    sectionTitle = $j(this).find(".sectionTitle");
    sectionTitle.click(function(){
    if($j(this).parent().height() == sections[$j(this).parent().attr("id")]["height"]){
        origHeight = sections[$j(this).parent().attr("id")]["origHeight"];
        $j(this).parent().animate({height:origHeight},"slow");
    }else{
        height = sections[$j(this).parent().attr("id")]["height"];
        $j(this).parent().animate({height:height},"slow");
    }
    })
    sectionTitle.mouseenter(function(){
    var properties = { "color" : '#F00' };
  //    $j(this).pulse(properties, 500, 3);
    $j(this).animate({"background-color":'#F00'},"slow");
    })

A live example of my code is here. http://fantasticvisions.net/test/me/

The classs sectionTitle is applied to a number of the H2 elements on the above page. Clicking them will cause the content to expand, using jQuery animate(). However, the mouseenter() fails.

What am I missing here? I have tried a number of other variations on this, and none work. The mouseenter() event does fire, and the code is executed (I have traced this) but the effect never seems to happen.

Sparky
  • 98,165
  • 25
  • 199
  • 285
leoplaw
  • 13
  • 2
  • 1
    What am I missing here? How can we expect `.pulse()` to work when you have it commented out? I mean, if you want help, perhaps providing a demo of the actual code without critical sections commented out would be best. – Sparky Apr 06 '12 at 20:29
  • 1
    Sparky672 you are a bit quick off the mark. Please re-read the post. It specifically mentions pulse() (when uncommented) does not work. That then means, you would in turn comment out the animate. Also the post also provides a live example, but since you missed it the first time, here it is again. http://fantasticvisions.net/test/me/ – leoplaw Apr 06 '12 at 20:46
  • Since you missed this part of my comment, here it is again: _"if you want help, perhaps providing a demo of the actual code **without critical sections commented out** would be best"_. `pulse` is clearly commented out in [your live example](http://fantasticvisions.net/test/me/). If you want help, post a proper example. http://sscce.org/ – Sparky Apr 06 '12 at 21:01
  • And again, if you read the post carefully, it states, **neither** animate() or pulse() were working. However JeffB has provided the solution. I had not included **JQuery UI**. Thanks for trying any way. – leoplaw Apr 06 '12 at 21:07

1 Answers1

1

.animate() is not working because jQuery by itself does not support animation of colors.

If you include jQuery UI, or a color animation plugin, this should work.

Jeff B
  • 29,943
  • 7
  • 61
  • 90