Note: This page requires MathPlayer
to display properly. To obtain MathPlayer, please visit the
MathPlayer Download page.
Note: This page requires
Internet Explorer for Windows and MathPlayer
to display properly. To learn more about obtaining Internet Explorer and MathPlayer,
please visit the
MathPlayer Download page.
There are two ways of making dynamic math expressions with MathPlayer. Simple kinds
of interactivity can be encoded directly in MathML using the <maction>
element. For more complicated kinds of interactivity, the combination of MathML and
scripting in a web page is extremely powerful.
The MathML element <maction> provides a way of adding interactivity to
an expression directly in the MathML markup for an equation. MathML only specifies the general
syntax for the <maction> element, and leaves it up to each MathML renderer
to define the particular kinds of interactivity it supports. This page
describes MathPlayer's implementation.
MathPlayer supports 5 kinds of interactivity:
Displaying a message in the browser status line when the reader moves the
mouse over an expression.
Highlighting an expression when the reader moves the mouse over it.
Toggling between several expressions when the reader clicks the mouse on
Hyperlinking to another HTML page when the reader click the mouse on an
Displaying a tooltip message when the reader moves the mouse over an
The kind of interactivity you want is specified using the actiontype
attribute. Other information, such as highlight colors, are passed in by other
attributes. Below are illustrations of each of the basic kinds of
Status Line Messages
The 'statusline' actiontype requires the <maction> element
contain two children, the second of which is an <mtext> element
containing the message to display.
[MathML Equation -- requires MathPlayer]
<m:mtext>A polynomial with no real roots</m:mtext>
The 'highlight' actiontype requires the <maction> element
contain one child, and one or both of the attributes
dsi:color and dsi:background. These attributes can be set to
either color keywords, or to a hexadecimal color value, such as
#ff0000 for red.
The 'toggle' actiontype requires the <maction> element
to contain two or more children. With each click, MathPlayer displays
the next child, wrapping around to the first child after displaying
the last child.
The optional selection
attribute can be used to set which child to display initially.
MathPlayer updates the selection attribute with each click, so
achieve very sophisticated dynamic math effect. This technique allows you to add buttons, text entry, and other interactive elements that
change the math in the page. Here is a simple example -- when you click on the
button, the background colors of two terms are swapped:
The source code for this example is shown below. The important points are:
Both HTML and MathML in the document can be manipulated using script code.
To find out how to do this, get one of the many books on Dynamic HTML.
Script can refer to elements in both HTML and MathML by id. In this
example, eq1, term1, and term2 are all ids attached to
various elements in the document.
After your script makes changes to a MathML instance, you must call the
update() method on the math element in order for your changes to
show on the screen.