MathML- Underscript, Overscript and UnderOverscript
Written by 29 May 2013
In mathematical equations, sometimes it is needed to put a bar, hat, dot and etc. under or over the main characters. This feature called underscript and overscript, and have been defined in HTML5 MathML. You can also use both of them (UnderOverscript) at the same time. The following example shows how to put some symbols above or below the main text. It is shown how to specify a script for a group of texts not just a single one and also how to use the combination of under and over scripts together.You can also turn on the accent option to make the scripts larger.
Code Snippet:
<!-- this script is provided by www.html5freecode.com coded by: Kerixa Inc. -->
<!-- This Script is from www.html5freecode.com, Coded by: Kerixa Inc-->
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<body style="font-size: 18pt;">
<math xmlns='http://www.w3.org/1998/Math/MathML' display='block'>
<munder>
<mi>A</mi>
<mo>⏟</mo>
</munder>
<mspace width="150px" />
<mover>
<mi>A</mi>
<mo>‾</mo>
</mover>
</math>
<math xmlns='http://www.w3.org/1998/Math/MathML' display='block'>
<munder accentunder="false">
<mi>A</mi>
<mo>→</mo>
</munder>
<munder accentunder="true">
<mi>A</mi>
<mo>→</mo>
</munder>
<mspace width="150px" height="20px" />
<mover accent="false">
<mi>ξ</mi>
<mo>∼</mo>
</mover >
<mover accent="true">
<mi>ξ</mi>
<mo>∼</mo>
</mover >
</math>
<math xmlns='http://www.w3.org/1998/Math/MathML' display='block'>
<munderover accent="true" accentunder="true">
<mi>f</mi>
<mo>~</mo>
<mo>^</mo>
</munderover>
<mspace width="150px" height="20px" />
<munderover >
<mrow>
<mi>x</mi>
<mo>+</mo>
<mi>y</mi>
</mrow>
<mo>→</mo>
<mo>‾</mo>
</munderover>
</math>
</body>
<div style="text-align: center"><br><font face="Tahoma"><a target="_blank" href="http://www.html5freecode.com"><span style="font-size: 8pt; text-decoration: none">HTML5 Free Code</span></a></font></div><a target='_blank' href='www.html5freecode.com' style='font-size: 8pt; text-decoration: none'>Html5 Free Codes</a>
Example:
Let's stay in touch
Get the latest and greatest javascript codes directly to your mail
TRENDING POST
VISITORS
