I like the effects but the fact it only works with Chrome is a no-go for me. I don't see it being be too difficult to get this working in safari, firefox or modern IE..
Looks like only CSS transition and animation is special cased for WebKit but that's been unprefixed in Firefox since years back.
https://hacks.mozilla.org/2012/07/aurora-16-is-out/
Edit:
Seems like getComputedStyle is buggy in Firefox?
« window.getComputedStyle($0).background
» ""
« window.getComputedStyle($0).backgroundColor
» "rgb(74, 144, 226)"
« window.getComputedStyle($0).backgroundImage
» "none"
$0 is the currently inspected element, in this case: .js-modal-2Edit2:
Possibly "works as intended"?:
> getPropertyCSSValue is required to return null for these, and we implement getPropertyValue in terms of getPropertyCSSValue.
https://bugzilla.mozilla.org/show_bug.cgi?id=889091
If so, the fix would be to use the actual attributes rather than the composite attribute.