EnlighterJS/Quickstart.html at master · joshmaag/EnlighterJS · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

	<title>EnlighterJS - QUICKSTART</title>

	<!-- Include EnlighterJS Styles -->
	<link rel="stylesheet" type="text/css" href="Build/EnlighterJS.yui.css" />

	<!-- Include MooTools Framework -->
	<script type="text/javascript" src="Resources/mootools-core-1.4.5-full-nocompat.js"></script>

	<!-- Include EnlighterJS -->
	<script type="text/javascript" src="Build/EnlighterJS.yui.js" ></script>

	<!-- Initialize EnlighterJS; set default language+theme as well as some options -->
	<meta name="EnlighterJS" content="Advanced javascript based syntax highlighting" data-language="html" data-theme="enlighter" data-indent="4" data-selector-block="pre" data-selector-inline="code.special" data-hover="NULL" />
</head>
<body>
	<h1>Please view the page sources</h1>

	<h4>jQuery Code (Javascript) - highlighted by EnlighterJS</h4>
<pre data-enlighter-language="jquery" data-enlighter-highlight="1,4">
$('#loading-example-btn').click(function () {
	var btn = $(this)
	btn.button('loading')
	$.ajax(...).always(function () {
		btn.button('reset')
	});
});
</pre>
	<h4>Inline Code</h4>
	<p>EnlighterJS also supports <code class="special" data-enlighter-language="js">alert('Inline Sourcecode highlighting');</code> (since version 2.0).</p>
	<!-- TESTCASE STOP -->
</body>
</html>