# MathML In Action

Revision Information
• Revision slug: Mozilla_MathML_Project/Start
• Revision title: MathML In Action
• Revision id: 333219
• Created:
• Creator: fred.wang
• Is reviewed? Yes
• Reviewed:
• Reviewed by: fred.wang
• Is approved? Yes
• Is current revision? No
• Comment

## MathML in Action

Are you seeing nifty equations throughout this page? No? Too bad. Here is a screenshot of what you are missing. Download a MathML-enabled Mozilla build to remedy this sad situation.

You already have a MathML-enabled build but what you see on the screenshot is not what you get? In that case you are probably missing some crucial MathML fonts.

Now that you are well-equipped, you should be able to see this inline equation with varying accents: $\stackrel{^}{x}+\stackrel{^}{xy}+\stackrel{^}{xyz}.$ Next to it is this tiny formula, $det|\genfrac{}{}{0}{}{a}{c}\genfrac{}{}{0}{}{b}{d}|=ad-bc,$ which can also be typeset in displaystyle as $det | a b c d | = a d - b c .$

Mathematical typesetting is picky. MathML in Mozilla aims at complying with the MathML specification so that What You See Is What You Markup, or to put it another way What You See Is What You Made, or in short "WYSIWYM". The difference between these two is in the markup! $( ... ( ( a 0 + a 1 ) n 1 + a 2 ) n 2 + ... + a p ) n p$ $( ... ( ( a 0 + a 1 ) n 1 + a 2 ) n 2 + ... + a p ) n p$

The roots of this bold equation ${y}^{3}+py+q=0$ are also bold $y = - q 2 + q 2 4 + p 3 27 2 3 + - q 2 - q 2 4 + p 3 27 2 3 .$

As for the roots of the equation $a{x}^{2}+bx+c=0,$ click anywhere in the yellow area to zoom-in/zoom-out:

## Zoomable Math

### HTML Content

```    <p>
<math display="block">
<mstyle id="zoomableMath" mathbackground="yellow">
<mrow>
<mi>x</mi>
<mo>=</mo>
<mfrac>
<mrow>
<mrow>
<mo>-</mo>
<mi>b</mi>
</mrow>
<mo>&#xB1;</mo>
<msqrt>
<mrow>
<msup>
<mi>b</mi>
<mn>2</mn>
</msup>
<mo>-</mo>
<mrow>
<mn>4</mn>
<mi>a</mi>
<mi>c</mi>
</mrow>
</mrow>
</msqrt>
</mrow>
<mrow>
<mn>2</mn>
<mi>a</mi>
</mrow>
</mfrac>
</mrow>
</mstyle>
[/itex]
</p>

```

### JavaScript Content

```      function zoomToggle()
{
if (this.hasAttribute("mathsize")) {
this.removeAttribute("mathsize");
} else {
this.setAttribute("mathsize", "200%");
}
}

{
document.getElementById("zoomableMath").
}

Consider an interesting markup like this or other complex markups like these $Ell ^ Y ( Z ; z , τ ) := ∫ Y ( ∏ l ( y l 2 π i ) θ ( y l 2 π i - z ) θ ′ ( 0 ) θ ( - z ) θ ( y l 2 π i ) ) × ( ∏ k θ ( e k 2 π i - ( α k + 1 ) z ) θ ( - z ) θ ( e k 2 π i - z ) θ ( - ( α k + 1 ) z ) )$ $π ( n ) = ∑ m = 2 n ⌊ ( ∑ k = 1 m - 1 ⌊ ( m / k ) / ⌈ m / k ⌉ ⌋ ) - 1 ⌋$ $‖ ϕ ‖ W s k ( Ω g ) ≝ ( ∑ | α | ≦ k ∂ α ϕ ∂ ξ α L s ( Ω g ) s ) 1 / s$