Jump to content


Query engine

Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

has this been tested with any other selector query engine like qwery? I want to get this working on a lighter framework than jquery its a little to heavy for mobile stuff so I use enderjs.

Link to comment
Share on other sites

You can use pretty much anything for selecting your stuff, but the only built-in recognition inside TweenLite/Max is for jQuery (for obvious reasons). Hopefully your preferred selector allows you to easily get at the contents. For example, if it is like an array and you're selecting a single object, maybe you could do this:?


TweenLite.to( mySelector("#blah")[0], 1, {...})


I purposely stayed away from making the engine into a selector for many reasons (I can elaborate if you want).


Make sense?

Link to comment
Share on other sites

I'm working on mobile JavaScript menu and not using jQuery. The only trick is to ensure that you tween valid objects/elements. In the case where you use associative type selectors (those that require some engine or logic to 'acquire' a reference to the object/element) you just have to make sure you pass in a valid object/element.


So, like in Flash, you can refer to an object via an associative nature:

// IF someMovieClipName instance name exists in this, it works
TweenLite.to(this['someMovieClipName'], 1, {prop:value});


In JavaScript, without a selector engine finding the object/element reference, you'll like need to create a wrapper function yourself that gets it, or leverage whatever engine you're using and then pass that object/element reference into the tween, such as with jQuery selectors, which makes things super easy by $('#someElementId').

TweenLite.to('someElementName', 1, {css:{prop:value}});

function getInstance(idSelector){
  return document.getElementById(idSelector);
TweenLite.to(getInstance('someElementName'), 1, {css:{prop:value}});

var theElement = document.getElementById('someElementName');
TweenLite.to(theElement, 1, {css:{prop:value}});

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.