jQuery.alighter demo

More information, documentation and download on the project's page : http://pioul.fr/jquery-alighter/

HTML

<script src="http://pioul.fr/ext/jquery_alighter/jquery.alighter.min.js"></script>
<div class="paragraph">Lorem <span class="toALight">ipsum</span> dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation <span class="toALight">ullamco laboris</span> nisi ut aliquip ex ea commodo    
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla <span class="toALight">pariatur</span>. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum..
<div  class="toALight">
TEST
</div>
</div>

<button>next alight</button>

CSS

body {
    margin-left: 50px;
}

.paragraph {
    padding: 100px;
    border: 1px solid #000;
}

.toALight {
    font-weight: bold;
}

JavaScript

$(".paragraph").alighter({
    animationDuration: 0,
    timer: 0
});

$("button").bind("click", function(){
    $(".paragraph").data("alightData").alight();
});