> I want to morph to a class called "#mainNavigation ul li.active"
> Why does this work in all browsers, except IE? which demands something
> (simple) like morph to a class called like ".myanimation"
The issue is this regular expression in Fx::CSS::search:
var selectorText = (rule.selectorText) ? rule.selectorText.replace(/^\w+/,
function(m){
return m.toLowerCase();
}) : null;
When rule.selectorText is exposed to Moo as, for example, "#teSt
LI.animatiOn", the final selectorText will stay "#teSt LI.animatiOn",
instead of being changed to "#teSt li.animatiOn". Therefore, it would
not match the Fx.morph selector "#teSt li.animatiOn" (using the
traditional "lowest-insensitive-case" format or whatever we might call
it).
If you capitalize the element name in the Fx.Morph selector, it will
then work in IE -- but will break in browsers that automatically
toLowerCase the element names before exposing them (I don't know which
way is CSS/CSSOM standard). So something needs to change in in
::search, methinks.
-- Sandy