Basic usage

Add this before the body closing tag:
<script>$(window).fadeThis();</script>
and add one of the following classes to the elements you want to target:

Appear from left

<div class="slide-left"></div>

Appear from right

<div class="slide-right"></div>

Appear from top

<div class="slide-top"></div>

Appear from bottom

<div class="slide-bottom"></div>

Advanced usage

Set configuration for the whole page

$(window).fadeThis({speed: 1000}); <div class="slide-left"></div>

Set configuration per block

$('.block').fadeThis({speed: 1000});

<div class="block">

    <div class="slide-left"></div>

</div>

When defining elements options, the rule is First come, first served. The options set for a block doesn't override previous block options adressing the same elements, or page options. So if you use block options definition, don't use $(window).fadeThis() before!

Set configuration per element using HTML5 data attributes

$(…).fadeThis(…); <div class="slide-right" data-plugin-options='{"speed":200, "distance":400}'></div>

The options set by data attributes override any other options set per block.

Note the position and order of the quotation mark for the data attribute.
For some browsers, reverting this order may cause misunderstanding of the options.