Normally, when a web page loads, elements appear in random order, causing unpleasant flashing. With Emerge, you have fine control over this:

With Emerge, you don’t write Javascript. Instead, you specify the desired behavior declaratively. This includes order, timing, loading indicators and particular animations.

New in version 1.3

Video support, emerge-replay to replay animations.

Setup and basic usage

Add the following to the <head> of your page:

<script src="/path/to/jquery.js"></script>

<script src="/path/to/emerge.js"></script>



Now any element with class="emerge" will fade in after its contents are loaded:

<div class="emerge" >

... Show this only when it is ready ...

</div>



Emerge takes care of all <img /> tags and images used in CSS (backgrounds, list-style-images and so on), as well as videos inserted with the <video /> tag.

See the documentation for detail.