jQuery scale pulsate

I want to instruct my user on how to interact with a part of a website with a drawn arrow and handwritten instructions. I also want it to scale up and down repeatedly in a pulsate effect with jQuery. I know there is a pulsate plugin for jQuery, but开发者_开发技巧 I don't know how to mix that with scale. Thanks for your responses.

As far as I know, the jQuery pulsate is for opacity only. Instead of that, I wrote a quick "pulse" function. Just animates smaller, then larger and starts again. You need to call pulse in onload.

function pulse() {
 $('#arrow').animate({
    height: '200px'
  }, 400, function() {
    // First animate complete
    $('#arrow').animate({
      height: '150px'
      }, 400, function() {
        // Second animate complete
        pulse();
    });
  });
}

See demo here:

http://jsbin.com/ejeni4/2/

http://jsbin.com/ejeni4/2/edit

There may be a better way, and of course you probably need to clean up the css to make it point where you want, etc.