jsMath/test/sample.html

   1 <HTML>
   2 <HEAD>
   3 <TITLE>jsMath (Test):  jsMath Sample Page</TITLE>
   4 <!-- Copyright (c) 2007 by Davide P. Cervone.  All rights reserved. -->
   5 <!--
   6  | -----------------------------------------------------------
   7  | The following line loads and initializes jsMath.
   8  | You may need to edit the load.js file to set the
   9  | root URL for your site before this file will
  10  | display properly
  11  | -----------------------------------------------------------
  12 -->
  13 <SCRIPT SRC="../easy/load.js"></SCRIPT>
  14 </HEAD>
  15 <BODY>
  16
  17 <!--
  18  | -----------------------------------------------------------
  19  | Include this NOSCRIPT block to inform users that JavaScript
  20  | is required if they don't have it enabled.
  21  | -----------------------------------------------------------
  22 -->
  23 <NOSCRIPT>
  24 <DIV STYLE="color:#CC0000; text-align:center">
  25 <B>Warning: <A HREF="http://www.math.union.edu/locate/jsMath">jsMath</A>
  26 requires JavaScript to process the mathematics on this page.<BR>
  27 If your browser supports JavaScript, be sure it is enabled.<B>
  28 </DIV>
  29 <HR>
  30 </NOSCRIPT>
  31
  32 <BLOCKQUOTE>
  33
  34 <H1>jsMath Sample Page</H1>
  35
  36 This is a sample file showing you how to use jsMath to display mathematics
  37 in your web pages.  Be sure you have followed the <A
  38 HREF="http://www.math.union.edu/locate/jsMath/authors/installation.html">installation
  39 instructions</A> before loading this file.  Also, you may need to edit the
  40 <CODE>jsMath/easy/load.js</CODE> file to set the root URL for where jsMath
  41 can be found on your web site.  The rest of this document gives examples of
  42 how to enter mathematics in your pages.  Depending on the settings in
  43 <CODE>jsMath/easy/load.js</CODE>, not all of the mathematics below will be
  44 processed by jsMath.  Experiment with the settings in that file to see how
  45 they work.
  46 <p>
  47
  48 <HR>
  49 <p>
  50
  51 <H2>Some mathematics using <CODE>tex2math</CODE></H2>
  52
  53 The easiest way to enter mathematics is to use jsMath's <A
  54 HREF="http://www.math.union.edu/locate/jsMath/authors/tex2math.html">tex2math</A>
  55 plugin to identify the mathematics in your document by looking for <SPAN
  56 class="math">\rm\TeX</SPAN>-like math delimiters.  Here are some math
  57 equations using those markers.  Some inline math: $\sqrt{1-x^2}$ or \(ax^2+bx+c\),
  58 and some displayed math:
  59 $$\int {1\over x}\,dx = \ln(x)+C$$
  60 and
  61 \[\sum_{i=1}^n i = {n(n+1)\over 2}.\]
  62 Note that the first of these will not be processed unless you have enabled
  63 <CODE>processSingleDollars</CODE> in <CODE>jsMath/easy/load.js</CODE>,
  64 which is disabled by default.  That is because a single dollar sign can
  65 appear in normal text (as in "That will cost from <SPAN>$</SPAN>3.50 to
  66 <SPAN>$</SPAN>5.00 to repair"), and you don't want jsMath to try to typeset
  67 the "3.50 to " as mathematics.
  68 <p>
  69
  70 If you enable <CODE>processSingleDollars</CODE>, you might also want to
  71 enable <CODE>fixEscapedDollars</CODE>, so that it is possible to enter
  72 dollar signs by preceding them with a backslash.  Here's one that you can
  73 use to see the results of these settings:  \$ (an escaped dollar) and $x+1$
  74 (not escaped).
  75 <p>
  76
  77 It is also possible to use your own custom delimiters for marking the
  78 mathematics within your pages.  If you uncomment the <CODE>customDelimiters</CODE>
  79 array in <CODE>jsMath/easy/load.js</CODE>, then the following math will be
  80 typeset by jsMath:  some inline math [math]\sin(2\pi x)[/math] and some
  81 display math [display]x={-b\pm \sqrt{b^2-4ac}\over 2a}.[/display]
  82 You may change the delimiters to nearly anything you want, but they can not
  83 look like HTML tags, since some browsers will eliminate unknown tags, and
  84 jsMath doesn't get to look for the custom delimiters until <I>after</I> the
  85 browser has interpreted the page.
  86 <p>
  87
  88 <DIV CLASS="tex2math_ignore">
  89 You can prevent the <CODE>tex2math</CODE> plugin from processing a portion
  90 of a page by enclosing it in a tag that is of
  91 <CODE>CLASS="tex2math_ignore"</CODE>.  Often, that tag will be a
  92 <CODE>DIV</CODE> or <CODE>SPAN</CODE>, but it can be anything.  This
  93 paragraph is wrapped in a DIV tag with
  94 <CODE>CLASS="tex2math_ignore"</CODE>, and so no math delimiters will be
  95 processed:  $f\colon X\to Y$, \(x^2 \gt 5\), $$1\over 1+x^2$$ and
  96 \[\matrix{a& b\cr c& d}.\]
  97 Note that this includes the processing of escaped dollars (\$) and
  98 custom delimiters ([math]a \mapsto a^2[/math]) as well.
  99 This makes it possible to produce examples of how to enter mathematics on
 100 your site, for instance.
 101 </DIV>
 102 <P>
 103 JsMath will automatically ignore the text within
 104 <CODE>PRE</CODE> tags, so you can easily enter examples that way as well:
 105 <PRE>
 106    $f\colon X\to Y$, \(x^2 \gt 5\),
 107    $$1\over 1+x^2$$ and \[\matrix{a& b\cr c& d}.\]
 108 </PRE>
 109 <P>
 110
 111 Note that since the &lt; and &gt; symbols are used to denote HTML tags,
 112 these can be hard to incorporate into your <SPAN CLASS="math">\rm\TeX</SPAN>
 113 code.  Often, putting spaces around the &lt; or &gt; will make it work, but
 114 it is probably better to use <CODE>\lt</CODE> and <CODE>\gt</CODE> instead.
 115 Also note that the <CODE>tex2math</CODE> plugin does not allow any HTML
 116 tags to be within the math delimiters, with the exception of
 117 <CODE>&lt;BR&gt;</CODE>, which is ignored.
 118 <p>
 119
 120 See the <A
 121 HREF="http://www.math.union.edu/locate/jsMath/authors/tex2math.html">tex2math
 122 documentation</A> for more information.
 123 <p>
 124
 125 <HR>
 126 <p>
 127
 128 <H2>Mathematics without <CODE>tex2math</CODE></H2>
 129 <p>
 130
 131 If you are not using <CODE>tex2math</CODE>, then you will need to enclose
 132 your mathematics within <CODE>SPAN</CODE> or <CODE>DIV</CODE> tags that
 133 are of <CODE>CLASS="math"</CODE>.  Use a <CODE>SPAN</CODE> for in-line math
 134 and a <CODE>DIV</CODE> for displayed math.  For instance, <SPAN
 135 CLASS="math">P = (x_1,\ldots,x_n)</SPAN> and
 136 <DIV CLASS="math">
 137   A = \left\lgroup\matrix{a_{11}& \cdots& a_{1m}\cr
 138                 \vdots& \ddots& \vdots\cr
 139                 a_{n1}& \cdots& a_{nm}\cr}\right\rgroup.
 140 </DIV>
 141 <p>
 142 <HR>
 143 <P>
 144 <H2>More information</H2>
 145 <p>
 146
 147 See the <A HREF="http://www.math.union.edu/locate/jsMath/examples">jsMath
 148 example files</A> for more examples of using jsMath.  There are several <A
 149 HREF="http://www.math.union.edu/locate/jsMath/examples/extensions.html">extensions</A>
 150 to <SPAN CLASS="math">\rm\TeX</SPAN> that allow jsMath to interact better
 151 with HTML. These provide features such as colored text, tagging mathematics
 152 with CSS styles, and so on.
 153 <p>
 154
 155 More information is available from the <A
 156 HREF="http://www.math.union.edu/locate/jsMath/authors">jsMath author's
 157 documentation</A> site.  JsMath also has a <A
 158 HREF="http://sourceforge.net/projects/jsmath/">home page at
 159 SourceForge</A>, and that includes <A
 160 HREF="http://sourceforge.net/forum/?group_id=172663">public forums</A>
 161 for jsMath where you can ask the jsMath user community for help.
 162 </BLOCKQUOTE>
 163
 164 </BODY>
 165 </HTML>