Using jsMath to present mathematics in your own web pages is not hard. You need to do three things: jsMath Basics
- Load the
jsMath.js
JavaScript file.- Enter your mathematics using TeX commands surrounded by an appropriate
<SPAN>
or<DIV>
(see below).- Make a call to
jsMath.Process()
orjsMath.ProcessBeforeShowing()
at the bottom of your web page.These steps are explained more fully bellow.
Load the
You should include commands something likejsMath.js
file<SCRIPT SRC="path-to-jsMath/jsMath.js"></SCRIPT> <NOSCRIPT> <DIV STYLE="color:#CC0000; text-align:center"> <B>Warning: <A HREF="http://www.math.union.edu/locate/jsMath">jsMath</A> requires JavaScript to process the mathematics on this page.<BR> If your browser supports JavaScript, be sure it is enabled.</B> </DIV> <HR> </NOSCRIPT>at the top of your HTML file. It should be within the body of your document, not the header, as jsMath may insert a warning message for the user when the TeX fonts are not available, and the loading of the fallback methods also may cause text to be written to the document body. (See the documentation on loading jsMath in the document HEAD if you can't load jsMath in the
<BODY>
). These commands should follow any<STYLE>
commands that affect jsMath (see the information on customizing jsMath for details).The path-to-jsMath should point to the location where you have placed the jsMath package. You can make jsMath be available site-wide by putting it in a place that is easy for many web pages to access (say
http://your-host/jsMath/jsMath.js
), or you could make jsMath be local to your particular web page by putting it in the same directory as your.html
file (in which casejsMath/jsMath.js
would be sufficient to locate the jsMath code).You should not load jsMath from a server in a different domain from the one that servers the page that is using jsMath. If you do, jsMath may not be able to load some of its optional components (like the fallback code or the control panel code). This is a restriction placed on jsMath by the JavaScript security model, and is not something that jsMath will be able to overcome. You can, however, load jsMath from another server in the same domain as your main page. For example, if the main page is coming from
www.math.union.edu
and jsMath is taken fromunion.edu
, then jsMath will still be able to access its optional components. To do this, it sets thatdocument.domain
for the main page to be the largest common domain between the two addresses.The
<NOSCRIPT>
section, while not strictly necessary, is highly recommended, as it will point out to your readers who do not have JavaScript enabled (or don't have a JavaScript-capable browser) that they need to enable JavaScript in order to view the mathematics on your web page.
Enter your mathematics in TeX form
Within your HTML page, you enter mathematics using standard TeX commands (only the mathematical commands are included; the other formatting within your document should be handled using standard HTML). You enter in-lined mathematics by surrounding it with<SPAN CLASS="math">
and</SPAN>
. For example:If <SPAN CLASS="math"> f(x) = x+2 </SPAN> then <SPAN CLASS="math"> f(4) = 6 </SPAN>.To make a displayed equation, you use
<DIV CLASS="math">
and</DIV>
, as in<DIV CLASS="math"> \sum_{i=1}^{n} i = {n(n+1)\over 2} </DIV>See the examples pages for more samples of how to enter mathematics. (Use your browsers "view source" function.)
It is possible to use dollar signs or \(...\) and \[...\] to indicate mathematics, just as in real TeX files; see the documentation for the
tex2math
plugin for more information.
Call jsMath to process the mathematics
Once you have included mathematics in your web page, you must tell jsMath to process that mathematics when the page is loaded. To do this, you add one of the following commands at the bottom of your HTML file:<SCRIPT> jsMath.Process() </SCRIPT>or<SCRIPT> jsMath.ProcessBeforeShowing() </SCRIPT>The first will cause jsMath to process the mathematics in such a way that the user can read the page as the mathematics is being processed. This is best when you have a lot of mathematics on the page, as jsMath is not particularly fast, and it could take a long time to handle all the mathematics.The second will prevent the page from being displayed until all the mathematics has been processed. One reason to use this is when the "flickering" involved in processing the mathematics would be a distraction, but it will take longer for the page to show up, and if there is a lot of mathematics, your reader my decide it is not worth waiting for your page to show up.
The examples files use
jsMath.Process()
command (see in particular Struick's lectures), while the symbol tables mostly usejsMath.ProcessBeforeShowing()
, so you can use these to see the difference.You may put these calls in the
onLoad
handler for the document, but note that it really only makes sense to usejsMath.Process()
this way, as the page may be displayed before the handler runs by some browsers, sojsMath.ProcessBeforeShowing()
would not actually run until after the page was already displayed. On the other hand, usingjsMath.ProcessBeforeShowing()
in this way would still make all the mathematics be converted at once rather than each element showing up individually (which would reduce the distracting flicker of mathematics as it is being processed), and would allow the user to start reading the page without having to wait for all the math to be converted. In this case, you might wish to usesetTimeout('jsMath.ProcessBeforeShowing()',10);to be sure that the page has had a chance to be displayed by all browsers before the mathematics is processed.
|
|