:: Table of Contents

If you have a lot of equations to generate on a single pages, then the *latexit.js* script is a convenient way embed mathematics within your page without having to create lots of image tag by hand.

Add to <head> :

`<script src="http://latex.codecogs.com/latexit.js"></script>`

Add the attribute `lang="latex"`

to any tag where you want automated conversion of the content into a LaTeX equation. For example, adding this to a *<div>* tag:

```
<div lang="latex">
\frac{1+sin(x)}{y}
</div>
```

creates:

While use with a *<span>* element:

`<p>This equation <span lang="latex">\frac{1+sin(x)}{x^3}</span> appears on the same line as the text.</p>`

creates:

When writing many equations, or if you prefer the usual LaTeX notation within you text, then a variant on the above method will convert LaTeX notation within *[...]* and *$...$* into block or inline equations, respectively.

Given than `$`

is often used within javascript (particularly in jQuery) that might otherwise exist on a page, then we need a way to constain the LaTeX conversion to only those tags that should contain equations.

This is achieved by adding the function call `LatexIT.add(...)`

to tell LaTeX-IT what tags to check for mathematics. For example:

Add to <head> :

```
<script src="http://latex.codecogs.com/latexit.js"></script>
<script>LatexIT.add('p',true);</script>
```

and in the <body> :

```
<p>Dividing $x^2+1$ by $y^2$ gives\[\frac{x^2+1}{y^2}\]</p>
<p>The British pound was worth 1.5 US\$ or $1.1 \euro$</p>
```

Which creates:

If you need to write dollar (`$`

) on it own, then add a backslash (`\`

) before the dollar, as in (`\$`

).

To control the layout of the equations (background, border, position, etc.), then you can modify the .latex CSS style.

If you adopt a convention of using `<div lang="latex">`

for block equations that appear on their own lines, versus say `<span lang="latex">`

for equations you want
to appear inline, then you can control each independently within your CSS, i.e,:

`.latex {...}`

for**all**equations`span.latex {...}`

for inline equations`div.latex {...}`

for block equations

Copied to clipboard

An empty download box