1

Here's my codepen: http://codepen.io/Chiz/pen/epWbOb

It works well and all, but I want to apply JQuery UI's easeOutBack easing effect without using the entire oceanload of JQuery UI.

I see this old thread in 2011 where one of posters (Jake) mention about "borrowing" the code from the JQuery UI library and using just the easing code you need: jQuery easing functions without using a plugin

Problem is: how do I integrate the JQuery easing function into my code? Latest version of JQuery UI (1.8.24) : https://code.jquery.com/ui/1.8.24/jquery-ui.js

Tks!

$("div").hide();

$(window).on("click", function() {
  $("div").slideDown(300);
})
div {

  width: 300px;

  height: 300px;

  position: absolute;

  bottom: 0;

  background-color: gray;

  display: none;

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div></div>
Community
  • 1
  • 1
Xeon
  • 385
  • 3
  • 11
  • Extracting just what you need might seem like a good solution in the short term but is generally a maintenance nightmare. Why not just use the jQueryUI download page to get the effects core and the effect you want? Minified, it's not really that big. Also, the latest $.ui version is 1.11.4. – blgt Oct 07 '15 at 10:53
  • Tks, I got it. The question is, how does one include the easing effect inside the SlideDown function? I've been googling everywhere including http://api.jqueryui.com/easings/ but there's no sample code to show how to apply the easing inside SlideDown. Tks! – Xeon Oct 08 '15 at 03:51
  • The [`slideDown` api page](http://api.jquery.com/slidedown/) describes the easing option and has an example. Here's a fiddle: http://jsfiddle.net/5LcjLjfz/ – blgt Oct 08 '15 at 10:34

0 Answers0