Advanced Javascript Example

Example 1 - Different Inline+Block Config

Javascript Code - default language JS

$('#loading-example-btn').click(function () {
	var btn = $(this)
	btn.button('loading')
	$.ajax(...).always(function () {
		btn.button('reset')
	});
});

Inline PHP Code - Using classic Theme and PHP as default language

EnlighterJS also supports $content = print_r(array(1,2,3), true); (since version 2.0).
Not highlighted (selector not matching) $content = print_r(array(1,2,3), true);

Example 2 - Using native Element.enlight() extension

Just want to highlight single elements on your page, maybe loaded dynamically and not available on domready ?

XML Code

<building name="GlobalDynamics Main Building" id="0xFA8A91C6617DFA1B">
	<group level="2">
		<room number="123">Conference Room A</room>
		<room number="124">Conference Room B</room>
		<room number="125">Conference Room C</room>
		<room number="126">Conference Room D</room>
	</group>
	<group level="2">
		<room number="17">John's Office</room>
		<room number="19">Eric's Office</room>
	</group>
Example 3 - Using EnlighterJS in OOP context

This method is recommended if you want to do some advanced stuff

XML Code

<building name="GlobalDynamics Main Building" id="0xFA8A91C6617DFA1B">
	<group level="2">
		<room number="123">Conference Room A</room>
		<room number="124">Conference Room B</room>
		<room number="125">Conference Room C</room>
		<room number="126">Conference Room D</room>
	</group>
	<group level="2">
		<room number="17">John's Office</room>
		<room number="19">Eric's Office</room>
	</group>
Example 4 - Using Codegroups

If you need Codegroups, you have to use the EnlighterJS.Util.Helper utility function for initialiation which does the "magic" part for you!
Note: EnlighterJS.Util.Init as well as EnlighterJS.Util.Metainit trigger this utility!

XML Code

<building name="GlobalDynamics Main Building" id="0xFA8A91C6617DFA1B">
	<group level="2">
		<room number="123">Conference Room A</room>
		<room number="124">Conference Room B</room>
		<room number="125">Conference Room C</room>
		<room number="126">Conference Room D</room>
	</group>
	<group level="2">
		<room number="17">John's Office</room>
		<room number="19">Eric's Office</room>
	</group>

$('#loading-example-btn').click(function () {
	var btn = $(this)
	btn.button('loading')
	$.ajax(...).always(function () {
		btn.button('reset')
	});
});
Example 5 - Dynamical Content/AJAX

You can also load dynamic content and highlight it! The most simple way is the use of EnlighterJS.Util.Init utility function!