API Documentation

Use the domify plug-in to progressively enhance website content. Users with javascript disabled will see the markup inside the <noscript> tag. Use the jQuery plug-in to modify the content inside the no script tag before it is added to the dom - this is especially useful for image tags so that the location of the image can be modified in vertical scrolling or responsive design situations without downloading multiple versions of images.

Example 1

Demonstrates what happens when the plug-in is applied to a noscript tag - the tag is replaced by the content inside it:

before

<div id="example1">
  <noscript>
    <span>test markup</span>
  </noscript>
</div>

$('#example1 noscript').domify();

after

<div id="example1">
  <span>test markup</span>
</div>

Example 2

Modify content before it is added to the dom:

before

<div id="example2">
  <noscript>
    <span>test markup</span>
  </noscript>
</div>

$('#example2 noscript').domify(function() {
  $(this).text('hello world');
});

after

<div id="example2">
  <span>hello world</span>
</div>

Example 3

Modify the document fragment before it is added to the dom:

before

<div id="example3">
  <noscript>
    <span>test markup</span>
  </noscript>
</div>

$('#example3 noscript').domify(function() {
  $(this).wrap('<p></p>');
  return $(this).parent();
});

after

<div id="example3">
  <p>
    <span>test markup</span>
  </p>
</div>