By default, functionality is hooked to the data-xrayhtml attribute.
Bolting the data-xrayhtml attribute on without a value will give you inline code snippets, like so:
Use a heading element with an xraytitle class to add your own subtitle to the example text.
Also works with a data-title attribute but that approach is deprecated.
This is a paragraph with text.
Add class="antipattern" to show a bad example. Also works with subtitles as documented above.
Text is not a standard HTML element. Do not use this code.Setting “flip” as the value of the data-xrayhtml attribute will give you this snazzy flip-to-reveal animation (browsers without support for 3D tranforms will simply show/hide the code snippet).
The plugin fires off a create.xrayhtml event that can be used to attach features like a “copy to clipboard” option (using ZeroClipboard) or syntax highlighting (using Prism.js).