Skip to Demonstrations of various web javascript technologies (javascript required)

Link to a guarenteed 404 error

(function() {
  alert('Hello');
 }).call(this);

Hello there!

How are you?

Doot Doooot

AsciiMath vs TeX/LaTeX:

`AsciiMath`: `(1+2)/3=1`

\({\rm \TeX\! / \LaTeX}\): \(\frac{1+2}3=1\)

SVG TestHello.This is written in SVG.Wheee!

Demonstrations of various web technologies (javascript required)

<!DOCTYPE html>
<html>
 <head>
  <title>Testing</title>
  <meta charset="utf-8"/>
  <meta name=viewport content="width=device-width">
  <link src="./general.css" href="./general.min.css" rel="stylesheet">
  <!-- MathJax - my Recommended setup -->
  <script id="mathconf" type=text/x-mathjax-config>
   MathJax.Hub.Config({
    extensions: ["tex2jax.js","[Contrib]/xyjax.js", "ASCIIMathML.js"],
    tex2jax: {inlineMath: [ ['$','$'], ['\\(','\\)'] ],
    processEscapes:true},
    "HTML-CSS": {linebreaks:{automatic:true,width:"90% container"}}
    });
  </script>
  <script type=text/javascript>
   "undefined"!=typeof window.MathJax&&"undefined"!=typeof window.MathJax.Hub&&window.MathJax.Hub.Queue(["Typeset",window.MathJax.Hub]);
  </script>
  <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_HTMLorMML" async></script>
 </head>
 <body>
  <div id="content">
   <h1>Testing Testing</h1>
   <p>1 2 3 Testing</p>
   <div>`sum_(i=1)^n i^3=((n(n+1))/2)^2`</div>
  </div>
 </body>
</html>

Demontration of Mathematics

Use of MathJax and Syntax highlighting on this page using general-all.jade is done via the variable set:

- var require = {math:"1", syntax:"1"}

\(\rm\TeX / \LaTeX\): \\(\frac{3+5}{4}=2\\), Asciimath: \`(3+5)/4 = 2\`.

The above deliver \(\frac{3+5}{4}=2\) and `(3+5)/4 = 2` respectively. If you wish to learn more about these, you can go to their homepages: LaTeX-project.org or AsciiMath.org

`AsciiMath`

`AsciiMath` is exactly what it says on the tin: Math for ASCII readers. For instance, \`sum_(i=1)^n i^3=((n(n+1))/2)^2\` would become `sum_(i=1)^n i^3=((n(n+1))/2)^2`. It allows for semi-complex typesetting with high accuracy. It is the preferred for quicker documents, but due to lack of line breaks is only really useful for inline, however for the purposes used where I teach would actually be preferred due to high speed and logistics of creation. Be careful not to use plain \` Backticks \` backticks, or they'll look like code!

\[\rm\TeX / \LaTeX\]

\(\rm\TeX / \LaTeX \) is a more complex markup, but therefore allows far; far more control. For instance, whilst the same equation shown above requires far more work come out, it also allows much more fine-tuned control, including display options. For instance, blocks: \\[ \rm \TeX / \LaTeX \\] becomes \[ \rm \TeX / \LaTeX \]. Essentially it's just whichever you wish to use (or rather whichever is easier for you). It can also be called apon using \$ Math \$ delimiters, and if you want a literal dollar sign you'd use \\$ 20.00, for instance. Example: $\rm \LaTeX$ becomes $\rm \LaTeX$. $E=mc^2$ to $E=mc^2$.

Code/Code blocks

Code is very simple, all you need is some backticks. It works perfectly for inline code.

There are three methods of using code:

  1. Line of backticks

This is what I use on this page for the most part. It makes code blocks quite quickly and easily. Plus the syntax parser can get to them. Heres an example using HTML, JavaScript and CSS (you can view the source here):

<!DOCTYPE html>
<html>
 <head>
  <title>Testing</title>
  <meta charset="utf-8"/>
  <meta name=viewport content="width=device-width">
  <link src="./general.css" href="./general.min.css" rel="stylesheet">
  <!-- MathJax - my Recommended setup -->
  <script id="mathconf" type=text/x-mathjax-config>
   MathJax.Hub.Config({
    extensions: ["tex2jax.js","[Contrib]/xyjax.js", "ASCIIMathML.js"],
    tex2jax: {inlineMath: [ ['$','$'], ['\\(','\\)'] ],
    processEscapes:true},
    "HTML-CSS": {linebreaks:{automatic:true,width:"90% container"}}
    });
  </script>
  <script type=text/javascript>
   "undefined"!=typeof window.MathJax&&"undefined"!=typeof window.MathJax.Hub&&window.MathJax.Hub.Queue(["Typeset",window.MathJax.Hub]);
  </script>
  <script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-MML-AM_HTMLorMML" async></script>
  <style>
   *{box-sizing: inherit}
   html,body{margin: 0;padding: 0;box-sizing: border-box}
   html > :not(#content):not(#MathJax_MenuFrame):not(#MathJax_Message){position: absolute;left:-9999999%; top: -999999%}
  </style>
 </head>
 <body>
  <div id="content">
   <h1>Testing Testing</h1>
   <p>1 2 3 Testing</p>
   <div>`sum_(i=1)^n i^3=((n(n+1))/2)^2`</div>
  </div>
 </body>
</html>

That is a good demontration, no?


In addition to that; there's the four-spaces method. Essentially the same, but still different enough to warrant it's own part.

<?xml version="1.0" encoding="utf-8" ?>
<xml>
 <document>
  <word:text>Hello</word:text>
 </document>
</xml>

And finally, there are inline backticks. Note that these are not run through by the syntax but do provide some ambiguity.

\boxed{\; \\ \frac 12 \times \frac{12}{\left(\cfrac 23\right)}\; \\ }= $\boxed{\; \ \frac 12 \times \frac{12}{\left(\cfrac 23\right)}\; \ }$

inserted by FC2 system