Home | Projects | Docs | Jargon |
Bugzilla
| LXR
| | Feedback | FAQ | Search |

This document illustrates some basic MathML constructions. It is tailored to display correctly with just the Symbol font. You can view its source. However, MathML documents tend to be verbose and you might get lost trying to locate a MathML fragment with the usual view source. This demo has been made to illustrate the following aspects. You can right-click on any math fragment of interest throughout this document. The context menu won't show up. Rather, the math fragment will zoom, and if you right-click a second time, you will see the MathML WYSIWYG markup of the fragment, and if you right-click again a third time, the fragment will revert to its initial state. This tri-state mode is aimed at limiting conflicts with other agents that compete for the mouse.

With MathML, one can build sets such as (go on, right-click any of these equations to experiment the zoom) $\left\{0,1,2,3,4\right\}$ or $\left\{\lfloor \frac{a}{b}\rfloor |{a}^{2}+{b}^{2}\le 3\right\}$, write calculus $\frac{dy}{dx}=\frac{1}{{y}^{2}}$, form rather complicated expressions $\underset{n\to N}{lim}{\left(1+\frac{1}{n}\right)}^{n}-{e}^{N}$, $k=\frac{\frac{{\partial}^{2}z}{\partial {x}^{2}}\frac{{\partial}^{2}z}{\partial {y}^{2}}-{\left(\frac{{\partial}^{2}z}{\partial x\partial y}\right)}^{2}}{{(1+{\left(\frac{\partial z}{\partial x}\right)}^{2}+{\left(\frac{\partial z}{\partial y}\right)}^{2})}^{2}}$, write vector equations $Y=aX+b$, etc.

Notice how the mathematics appear in the main flow of text and respond as you resize the window. You can also make displayed equations, such as the following ones:

$$x\stackrel{\text{maps to}}{\to}y={f}_{n}\left(x\right)={\left(1+\frac{1}{{x}^{n}}\right)}^{n}$$
$${\int}_{a}^{b}f\left(x\right)dx=\frac{b-a}{6}[f\left(a\right)+4f\left(\frac{a+b}{2}\right)+f\left(b\right)]-\frac{{(b-a)}^{5}}{4!5!}{f}^{\left(4\right)}\left(\eta \right),\phantom{\rule{1em}{0ex}}a\le \eta \le b$$
$$\left|x\right|=\{\begin{array}{cc}\hfill -x& \text{if}x0\hfill \\ \hfill x& \text{otherwise}\hfill \end{array}$$
You can also typeset 2D mathematical constructs such as matrices.
The following example shows the *i*-th step of the multiplication
of a matrix *A* by a vector *x* (notice how
${a}_{i1},...,{a}_{in},{x}_{1}$
are on the same baseline, other alignments are possible):
$$i\text{-th row}\left[\begin{array}{ccccc}{a}_{11}& {a}_{12}& {a}_{13}& ...& {a}_{1n}\\ :& :& :& ...& :\\ {a}_{i1}& {a}_{i2}& {a}_{i3}& ...& {a}_{in}\\ :& :& :& & :\\ {a}_{n1}& {a}_{n2}& {a}_{n3}& ...& {a}_{nn}\end{array}\right]\left[\begin{array}{c}{x}_{1}\\ {x}_{2}\\ {x}_{3}\\ :\\ {x}_{n}\end{array}\right]$$

In Mozilla, MathML runs inside the main browser. So it
responds to other browser operations such as the zoom (try View -> Text Zoom), and
you can do links
${a}^{2}+{b}^{2}={c}^{2}$,
apply stylistic
**effects
${a}^{2}+{b}^{2}={c}^{2}$
**,
or use color
**
${a}^{2}+{b}^{2}\colorbox[rgb]{1,1,0}{$=$}{c}^{2}$
**
in very strange ways
$$\frac{p\left(x\right)}{q\left(x\right)}=\frac{{a}_{0}+{a}_{1}x+{a}_{2}{x}^{2}+...+{a}_{n-1}{x}^{n-1}}{{b}_{0}+{b}_{1}x+{b}_{2}{x}^{2}+...+{b}_{n-1}{x}^{n-1}}.$$

You can also do other weird and risky things which are not portable, bongo warns, such as mixing MathML with other markups $$\mathrm{lizard}+\mathrm{bongo}=\frac{}{\int \underset{a}{\overset{b}{}}dx}+$$

And you can turn to JavaScript and the DOM for dynamic operations.

Fill the gaps in this matrix with resizable input fields.

$$A=\left[\begin{array}{cc}1& \\ & 4\end{array}\right]$$
Each entry of the following matrix represents
${(x+y)}^{n}$ for some *n*.
When you left-click any individual entry, it should toggle between its expanded and
unexpanded forms. You can also unexpand all or
expand all.

$$\begin{array}{c}\begin{array}{lll}{\left(x+y\right)}^{0}1& {\left(x+y\right)}^{1}x+y& {\left(x+y\right)}^{2}{x}^{2}+2xy+{y}^{2}\\ {\left(x+y\right)}^{1}x+y& {\left(x+y\right)}^{2}{x}^{2}+2xy+{y}^{2}& {\left(x+y\right)}^{3}{x}^{3}+3{x}^{2}y+3x{y}^{2}+{y}^{3}\\ {\left(x+y\right)}^{2}{x}^{2}+2xy+{y}^{2}& {\left(x+y\right)}^{3}{x}^{3}+3{x}^{2}y+3x{y}^{2}+{y}^{3}& {\left(x+y\right)}^{4}{x}^{4}+4{x}^{3}y+6{x}^{2}{y}^{2}+4x{y}^{3}+{y}^{4}\\ {\left(x+y\right)}^{3}{x}^{3}+3{x}^{2}y+3x{y}^{2}+{y}^{3}& {\left(x+y\right)}^{4}{x}^{4}+4{x}^{3}y+6{x}^{2}{y}^{2}+4x{y}^{3}+{y}^{4}& {\left(x+y\right)}^{5}{x}^{5}+5{x}^{4}y+10{x}^{3}{y}^{2}+10{x}^{2}{y}^{3}+5x{y}^{4}+{y}^{5}\end{array}\end{array}$$

And there could be more...

For more information about MathML in Mozilla, see the
MathML Project Page.
There are links to more samples,
screenshots
and instructions on how to
download fonts for various platforms. These fonts
are *required* to view other examples beyond the basic constructions
illustrated here.