-
Notifications
You must be signed in to change notification settings - Fork 0
Transforms
CSS 2D transforms are used to stretch and scale parens and the square root radical in src/commands.js.
These are not supported in IE <9, but IE >=5.5 have [Matrix Filters](http://msdn.microsoft.com/en-us/library/ms533014(v=VS.85%29.aspx) that can do arbitrary 2D transforms, too. Unfortunately, used naively they alias horribly, but I figured out two tricks:
- rather than stretching with the matrix filter, which rasterizes the text first and hence results in aliasing, set a larger
font-sizewhich expands the text as vector images described by the font before rasterizing when shrinking with the matrix filter - inspired by this, I discovered that setting an opaque background causes it to anti-alias almost perfectly (normal text is actually even better, but not by that much)
Results: http://jsfiddle.net/u2GUr/3/
(Click to enlarge)
Unfortunately I couldn't find any way to have a transparent background and still anti-alias, so I was forced to give everything stretched by the matrix filter an opaque white background. This means pages that want to give their MathQuill textbox a background color besides white, and support any IE <9, need a CSS rule giving all .mathquill-rendered-math .matrixed (may change to .mq-matrixed in v0.3) elements that same background color.
(Internal note: this necessitated .selected .matrixed's background rule being !important, since it is likely to have lower specificity than the external rule setting the background color of the .matrixed.)
Transparent background attempts: http://jsfiddle.net/9V5Gs/2/
(Click to enlarge)