Simply Program

Simply programming - It’s a life style
Filed under Programming, Javascript

I found something very interesting while working with YUI's Animation Library over the weekend.

When using its sizing controller I noticed that it would only size individual elements - For example, your basic element would look like this:

JavaScript:
  1. div id="item1"

So, you then register "item1" with the YUI animation controller and do yourself a bit of animating.

JavaScript:
  1. var anim = new YAHOO.util.Anim(itemObj,
  2. attributes, 1.0, YAHOO.util.Easing.backOut);
  3.  
  4. anim.animate();

Now, this is all fine and dandy - what I want you to do now is place some text within "item1". You will notice it does not resize with your registered element. This however is not what I am concered about - YUI understood this issue and created an attribute "fontSize" to handle this problem.

However, place an Image within this element and you will find that it simply sits in the middle of the screen while your div does its animation dance. I have searched all over the developer forums and API documentation to see if there is a function or a way to make every element no matter image, font, or other divs to animate with a SINGLE parent element. So far I have had 0 luck - If ANYONE knows of such a function please let me know! Why do I want to know?

Simple - I have started to construct my own function that removes all elements within the given parent item and registers them with the animation controller. Now, why would I want to waiste all my hard earned time off to do this if it has already been done... right? :)

Until I hear from someone I will continue to create it on my 1 hour off weekends ;)

Posted by sp on Tuesday, May 15th, 2007


You can follow any responses to this entry through the magic of "RSS 2.0" and leave a trackback from your own site.