Simulator88
Simulator88

Reputation: 637

Trying to easeoutsine a div with Jquery

I made the following script:

The div i want to animate:

DIV = $('div.info_holder');

And the function:

function bezar(){

DIV.stop().animate({
            opacity: 0
        }, {
            duration: 400,
            easing: "easeOutSine",
            complete: function () {
               DIV.css("display", "none")
            }
        })};

Why I'm not able to get this work? :)

Upvotes: 1

Views: 899

Answers (1)

Tom Davies
Tom Davies

Reputation: 1890

are you sure easeOutSine is available to you as an easing function (ie you are using jQ UI or some other easing plugin)? While .animate() is part of jQuery core the additional easing functions are not.

If you just want easeOutSine do something like:

$.extend($.easing,
  {
    easeOutSine: function (x, t, b, c, d) {
      return c * Math.sin(t/d * (Math.PI/2)) + b;
    }
  }
)

in your JavaScript before you call animate() and that should work.

Upvotes: 3

Related Questions