ded / morpheus

A Brilliant Animator
504 stars 57 forks source link

border-color doesn't fade, background-color does #17

Closed coolaj86 closed 12 years ago

coolaj86 commented 12 years ago

I've got an input validation that I want to turn bright green and then fade out to nothing.

    function morph(el) {
      morpheus(el, {
          "border-color": "#0FF"
        , "duration": 1000
        , "complete": function () {
            $(el).removeClass('saved')
          }   
      }); 
    }

Is there a technical limitation as to why border-color and background-color behave differently?

ded commented 12 years ago

it works. the readme says when doing color animation that you need to explicitly set the style on it first — and not with a named color (only #hex or rgb())

that means, do this first...

// fade from 0ff -> fff
el.style.borderColor = '#0ff'
morpheus(el, {
  'border-color': '#fff'
  ...
})