TextRoller is a Javascript and CSS library for smoothly transitioning words. This plugin is largely derived from the plugin Odometer made by Adam Schwartz and Zack Bloom of HubSpot.
This plugin have no dependancies. Download the production version or the development version.
In your web page:
<!-- the odometer stylesheet -->
<link rel="stylesheet" href="../themes/odometer-theme-minimal.css" />
<script src="../textroller.js"></script>
<div id="roller" class="textroller"></div>
<script>
var elt = document.getElementById("roller");
var texts = ["pancake", "muffin", "cookie"]
elt.textroller = new TextRoller({
el: elt,
values: texts, // an array of texts. default : [el.innerHtml]
align: "left", // right, left or middle. default : middle
delay: 3000, // in milliseconds, default : 5000
loop: false // at the end, restart. default : true
});
</script>