Vertical Text Scrolling Plugin With jQuery - scrollText.js

scrollText.js is a jQuery plugin used for creating a vertical text scroller that scrolls vertically through a list of text content just like the obsolete HTML marquee feature. Ideal for news ticker, quotes scroller and etc.

How to use it:

1. Create a list of text entries and then insert them into a container element like this:

<div class="container">
  <ul>
    <li>Lorem ipsum dolor sit amet</li>
    <li>consectetur adipiscing eli</li>
    <li>Duis nec sodales purus</li>
    <li>Pellentesque ornare justo</li>
    <li>Id dui condimentum</li>
    <li>Ut tellus quam, congue a fringilla</li>
    <li>Proin ac enim mauris</li>
    <li>Sed mauris nunc, tincidunt vitae</li>
    <li>Urna ut, tempor interdum sapien</li>
    <li>Nullam risus ante, condimentum</li>
  </ul>
</div>

2. Set a fixed height to the container and hide the overflowed content.

.container {
  width: 360px;
  height: 240px;
  line-height: 30px;
  overflow: Hidden;
}

3. Download and put the JavaScript file jQuery.scrollText.js after jQuery.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="jQuery.scrollText.js"></script>

4. Initialize the text scroller.

$(".container").scrollText();

5. Set the direction of the scrolling within the text scroller.

$(".container").scrollText({
  'direction': 'down' // or 'up'
});

6. Set the scrolling speed.

$(".container").scrollText({
  'duration': 2000
});

7. More configuration options.

$(".container").scrollText({

  // container
  'container': '.container', 

  // child elements
  'sections': 'li', 

  // scrolling speed
  'duration': 1000,

  // endless loop
  'loop': true,

  // CSS appended to the current item
  'currentClass': 'current',

  // or 'down'
  'direction': 'up'
  
});

---

This awesome jQuery plugin is developed by FrankFan. For more Advanced Usages, please check the demo page or visit the official website.