Giter Club home page Giter Club logo

jquery.easing's Introduction

jQuery Easing Plugin

What is it? A jQuery plugin from GSGD to give advanced easing options. More info here

For CDN please use CloudFlare https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js to help my host. Thank you.

AMD or CommonJS usage

// CommonJS
const jQuery = require('jquery');
require('jquery.easing')(jQuery);

// AMD
define(['jquery', 'jquery.easing'], function (jQuery, easing) {
	easing(jQuery);
});

Building and testing

  • Clone the repo
  • npm install
  • Make changes
  • Test against files in /examples
  • Build minified version with npm run build

jquery.easing's People

Contributors

brettz9 avatar clarmso avatar dependabot[bot] avatar dheckl avatar dmethvin avatar gdsmith avatar graingert avatar krinkle avatar michelvosje avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

jquery.easing's Issues

Google PageSpeed reports that the minified version needs optimizing further

Google pagespeed report:

Minify JavaScript
Compacting JavaScript code can save many bytes of data and speed up downloading, parsing, and execution time.
Minify JavaScript for the following resources to reduce their size by 991B (53% reduction).
Minifying https://cdnjs.cloudflare.com/…s/jquery-easing/1.3/jquery.easing.min.js could save 991B (53% reduction) after compression.

Improving the min.js version improves PageSpeed score and therefore your SEO

Redo release tag for bower

The latest release tag is pointing to a commit (979dcad) that is missing the bower.json file, and so bower can not read the project metadata, (main file, etc).

Can you delete the 1.3.2 tag and recreate it at commit bbb5727? Or make a new release?

Once this is done, it will fix Issue #14.

PS. I made a request to the bower folks to point the jquery.easing bower package to this repo instead of the bower-jquery-easing fork: bower/registry#165

TypeError: Cannot read property 'swing' of undefined

Hi,

I have installed jQuery and Jquery.easing modules in a project but I am getting below error when run the page.

at /node_modules/jquery.easing/jquery.easing.js:22:28
at /node_modules/jquery.easing/jquery.easing.js:15:13
at Object. (/node_modules/jquery.easing/jquery.easing.js:19:3)
at Module._compile (internal/modules/cjs/loader.js:1176:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1196:10)
at Module.load (internal/modules/cjs/loader.js:1040:32)
at Function.Module._load (internal/modules/cjs/loader.js:929:14)
at Module.require (internal/modules/cjs/loader.js:1080:19)
at require (internal/modules/cjs/helpers.js:72:18)
at eval (webpack-internal:///jquery.easing:1:18)

I seriously dont know what the cause of this issue.

Please help me to resolve this issue

Wasnt sure how else to get in touch with you.

I was using your easing script on a site I made. You put up a notification and linked me to an other one I could use. Just wanted to say thank you and sorry for any inconvenience I may have caused. I'm new to javascript and I didnt know it was a problem to link to your script. Ive updated my code to point to the link you sent.

Really sorry, and thanks again.

Low quality source code

The source code of this library is written as if it were minified code, and it also has lots of redundant logic problems. I'm trying to expand this into non-jQuery functions to use in another library which is why I've discovered these cases.

For example these lines of code:

https://github.com/gdsmith/jquery.easing/blob/master/jquery.easing.js#L104-L111

There's a few things here that are undesirable in source code:

  • One letter variable names, including the fn parameters, making debugging difficult / impossible. Fortunately this StackOverflow answer is helpful.
  • The highlighted function first hard codes var p = 0; and then checks if (!p) p=d*(.3*1.5);. Things like this could be avoided for efficiency, and make the source code more readable.
  • Incorrect javascript scoping is used, in the same function var s=1.70158; and then else var s = you can see s is redefined incorrectly using a second var declaration
  • Inline operators are used in if statements such as if ((t/=d/2)==2) which mutates the variable t in place, making tracing code unnecessarily difficult.
  • In general these functions aren't written like source code. They're written like (poorly) hand optimized, (poorly) hand minified functions that would be better left to Uglify or Closure Compiler work on them.

Since these functions have clearly stood the test of time the logic in them is sound and doesn't need to change for the library to work. For a learning opportunity, however, there is much room for improvement.

How to disable the jquery easing reference from Jquery "src" file

Hi @everyone , I am using jQuery , jQuery UI and jQuery easing for my project and used via NPM (package.json).

While doing vulnerability scan jQuery UI / jQuery easing considered as vulnerability and security team recommended to remove the jQuery UI & jQuery Easing / Write wrapper for jQuery UI & jQuery.easing

I need a workaround to remove the reference of jQuery easing from Jquery lib source code either wrapper for jQuery easing.

Vulnerability description given by our Appsec Team

Recommended Version(s): No recommended versions are available for the current component.

Explanation: The jquery package is vulnerable to Denial of Service (DoS). The jQuery.each( jQuery.expr.match.bool.source.match( /\w+/g ) function in the attr.js file lacks the logic to convert the attribute name into lowercase. Any attribute getter using a mixed-cased name for the boolean attributes goes into infinite recursion, exceeding the stack call limit. This causes Denial of Service (DoS).

Note: This vulnerability has been assigned CVE-2016-10707.

Advisory Deviation Notice:
The Sonatype Security Research team discovered that this vulnerability was introduced in version 1.11.0-beta3 and not 3.0.0-rc1 as stated in the advisory. This finding coincides with issues reported against versions 2.2.4 and 1.12.14 and confirmed by jQuery maintainers several months after this vulnerability's initial publication.
Detection: The application is vulnerable by using this component.
Recommendation: We recommend upgrading to a version of this component that is not vulnerable to this specific issue.

Note: If this component is included as a bundled/transitive dependency of another component, there may not be an upgrade path. In this instance, we recommend contacting the maintainers who included the vulnerable package. Alternatively, we recommend investigating alternative components or a potential mitigating control.
Threat Vectors: CVSS:3.1/AV:N/AC:L/PR:N/UI:N/S:U/C:N/I:N/A:H

Thanks in Advance ! Expecting helping hands

Regards,
Gopi

easeInBack positioning problem in Firefox

Hello,
my easeInBack animation works fine except for Firefox.

The end positions of the animations get randomly displaced.

With standard swing function everything works as expected.

See my post on stackoverflow.

And this fiddle
Run the fiddle several times both in Chrome and in FF and observe the gap where you see the green background. Sometimes it is narrow, sometimes wider.

BUG with new version of jquery easing

Hi,

I am updating some of my plugin but some weird bug is happening with jquery easing. Using the old version (1.3) the problem does not happen, using the new version the problem happens.

Both codes below are absolutely exactly the same. Nothing is different except the version of jquery easing.

https://quemfazsite.com.br/temp/teste-old-easing.php
https://quemfazsite.com.br/temp/teste-new-easing.php

Open the first link (old) and click GO1 and GO2. You will see an animation in the background color. When you open the second link and click in GO1 and GO2 you will see the animation works strangely, a black background appears in the element.

The strangest thing here is that I am not even using EASING in this page! The animation is being done with the default, LINEAR but no other fancy easing is being used and even so jquery easing messes with the animation.

Can we expect a solution soon?

Creating this plugin to be AMD compliant?

This is more of a comment/query. I am trying to include this plugin using requirejs and I am having a lot of issues with this loading. I have tried to shim it but with no luck. Will this plugin be rewritten to be AMD compliant?

IE 7 through 10 Object doesn't support property or method 'easeInBack'

Using easing with jQuery 1.9.1 in an asp.net MVC project all browsers respond fine to code such as this:
$('#myElement').animate({ top: '0', left: '0' }, 400, "easeInBack");
But IE 7 through 10 all fail with the error in the title. Irrespective of the easing string used.

It does however work when I don't specify an easing string, which made me think the easing script wasn't being loading properly, but it is there and it works in all other browsers.

I don't know what other details to give to reproduce the exceptions?

TypeScript version with type definitions

Hi All,

Thank you for your time making this project available!

Today I was doing some experiments on a TS project and I've converted the source to TypeScript.

https://gist.github.com/slig/145d7333052b7b2532f90d9f47e20d8e

In the end I decided I'll stick with the default swing from jQuery, but I thought the source might be useful for someone else.

Just to be clear, I don't expect the project to be converted to TS. I'm posting this here so someone googling for the type definitions can find them on the above gist.

Include `integrity` hash

It'd also be nice to have your file(s)' CDN integrity hash on Github, so that one can confirm the integrity at the source of what any particular CDN is serving.

[Solved] No fade in when parameter "visible" is used in up direction

I noticed there was no pretty fade in effect for the upcoming slide when the "visible" parameter is used in the "up" direction. This is due to the fact that the element at the top is moved down and then faded in (even though it is not in the view yet).

I modified the code to

  1. hide the elements that should not be visible when starting in init() function
  2. fade in the next visible item instead of the bottom item in move() function

Code added to init()

if(s.opts.visible > 0){
    hideAfterIndex = s.opts.visible-1;
    s.targ.children(":gt("+hideAfterIndex+")").hide();
}

New code for move function

function move( dir ){
    var sel, eq, appType;

    if( !s.elem.is(':visible') ) return;

    if( dir == 'up' ){
        sel = ':first-child';
        eq = '-=';
        appType = 'appendTo';

        //Added to determine next slide to fade
        if(s.opts.visible > 0){
            nextToShow = s.opts.visible + 1;
            fadeSel = ':nth-child(' + nextToShow + 'n)'; 
        }else{
            fadeSel = sel;
        }
        //End addition

    }else{
        sel = ':last-child';
        eq = '+=';
        appType = 'prependTo';

        //Addition
        fadeSel = sel;
        //End addition

    }

    var selChild = s.targ.children(sel);

    //Added to get elem for next slide to fade
    var fadeChild = s.targ.children(fadeSel)
    //End addition

    var height = selChild.outerHeight();

    s.targ.stop(true, true).animate({
        'top': eq + height + "px"
    }, s.opts.speed, s.opts.easing, function(){
        //Removed fadeIn() here
        selChild.hide()[appType]( s.targ );
        //End remove

        //Added to fade in proper element
        fadeChild.fadeIn().addClass("faded");
        //End addition

        s.targ.css('top', 0);

        adjHeight();

    });
}// Move

Maybe this helps someone.

bower package needs bower.json

for grunt:wiredep plugin all bower dependencies need a bower.json file and "main" option. But jquey.easing installation does not have. Please check with "bower install jquery-easing-original"

npm and tag consistency

I see there is a tag for 1.4.2, but that tag updated package.json, bower.json, etc. to 1.4.1 instead (and the npm package doesn't have all of that commit's changes either). Could we get a new release where the tag reflects the npm package version? Thanks!

Your BSD license is not compatible with GPL and cant be used in WordPress

I wanted to use your script in a WordPress theme and because of the BSD license this is not possible. There are few BSD licensees that are compatible with GPL but it has to be specified. Right now your license is global and says only BSD so it falls under OriginalBSD.

Here is what your license is currently referring to
https://www.gnu.org/licenses/license-list.en.html#OriginalBSD

Any way you can change this to GPL compatible license so that we can use it in WordPress?

License document

Hey,
Thanks for the good effort in building this library. We would like to use your node in our project.

Can you let us know what license have been assigned to this library?

Thanks
Kandy

Easing will not work in IE8, e.g. with "easInExpo"

I'm using the plugin in IE8 and saw a strange issue
easing
The effect will not work in IE8 and also there is this strange invalid attribute "easing" on the animate-element. @gdsmith Can you give some informations about this issue and maybe also about the browser compatibility?

Documentation for 1.4.x jQuery.easing.method() is needed

The documentation for the plugin at the official site http://gsgd.co.uk/sandbox/jquery/easing/ needs to be updated to explain and guide other developers around the breaking of the Bonus feature where easing 1.3.x is based on jQuery 1.x and 2.x and easing 1.4.x is based on jQuery 3.x.

It would be nice to also have this documentation in the README.md for https://github.com/gdsmith/jquery.easing

jQuery.easing.method()'s old signature no longer works the same in 1.4.x:

jQuery.easing.method(
	null†,
	current_time,
	start_value,
	end_value,
	total_time)

Wherever it is used directly in custom animations, the formula needs to be tweaked into this form:

// - x is (current_time / total_time), aka "percentage completed"
// - d is (end_value - start_value), aka "distance"
// - s is (start_value), if not zero
jQuery.easing.method(x) * d + s

One example of using jQuery.easing.method() directly is when creating window.scrollBy() smooth scroll animations. jQuery handles CSS animations easily, but doesn't quite fit for controlling window scrolling position, as far as I know.

jquery.easing.1.3.min.js missing trailing semicolon

This causes my scripts to fail with an Uncaught TypeError: object is not a function error when this file is concatenated into my vendor.js file.

As a workaround I'm using jquery.easing.1.3.js instead.

Thanks.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.