Last updated on January 17th, 2016 at 09:16 am

Simple Jquery infinite news ticker.We have some limitations while using the regular MARQUEE tag which is available in HTML. This particular text scroll is built using jquery which has a very eye caching and repeating scroll without any delay which we usually experience while using marquee. It even has setting to show the number of lines.Other settings include
Speed: You can set this to suit your requirement
Pause: The delay in showing each line
Animation: Fade or anything you need
MousePause: Can be set as true or false. If you want the scroll to pause when mouse pointer is over it.
Height: Self explanatory.
Direction: Up or Down.

For this we need a very basic css styling.

{width: 200px;margin: auto;margin-top: 30px;
border-bottom: 2px solid #333333;border-top: 2px;solid#333333;}
#news-container ul li div{
padding: 2px;background: #ffffff;

Then some libraries including the regular jquery library.

<script type="text/javascript"src="jquery.js">
<script type="text/javascript"src="jquery.vticker-min.js">

The javascript settings page. You can customize this according to your requirement.

$(function() {$('#news-container').vTicker({
speed: 900,
pause: 3000,
showItems: 1,
height: 0,

Then comes the HTML part.

<div id="news-container"><ul>
This is the first set of news <br></div></li>
Second set of news</div></li>


Leave a Reply

Your email address will not be published. Required fields are marked *