ded / morpheus

A Brilliant Animator
504 stars 57 forks source link

Does morpheus rely on CSS work or JS only? #52

Closed stereokai closed 11 years ago

stereokai commented 11 years ago

I can see that morpheus accepts animations in "css3 transform" format. But does morpheus actually invoke CSS3 transforms or does it do everything in Javascript?

Thanks a lot.

stereokai commented 11 years ago

Forget it, I found my answer in the source code.

ded commented 11 years ago

@stereokai no worries. it uses the DOM api to do it.

stereokai commented 11 years ago

Yes. Silly me, I forgot to provide the answer to my own question for other curious-heads bumping into this page in the future.

So basically, this code (from the one tween to rule them all function), is responsible for updating the values on each animation frame through the DOM API (the style object, in case we're not clear enough):

        for (var k in options) {
          v = getTweenVal(pos, units, begin, end, k, i)
          k == 'transform' ?
            els[i].style[transform] = formatTransform(v) :
            k == 'opacity' && !opasity ?
              (els[i].style.filter = 'alpha(opacity=' + (v * 100) + ')') :
              (els[i].style[camelize(k)] = v)
        }