Ticker-Simple
A simple Ticker using html, css, query
HTML
<div class="ticker">
<ul id="ticker">
<li>Dummy data is benign information that does not contain any useful data, but serves to reserve spac...</li>
<li>For testing, dummy data can also be used as stubs or pad to avoid software testing iss...</li>
<li>In operational use, dummy data may be transmitted for OPSEC purposes.</li>
<li>Dummy data must be rigorously evaluated and documented to ensure that it does no...</li>
<li>The topic of this article may not meet Wikipedia's general notability guideline.</li>
</ul>
</div>
CSS
.ticker {
width: 400px;
height: 50px;
overflow: hidden;
text-align: left;
}
.ticker h3 {
padding: 0 0 10px 10px;
border-bottom: 1px solid #A7A7A7;
}
ul {
list-style: none;
padding: 0;
margin: 0;
font-style: italic;
}
ul li {
list-style: none;
height:50px;
padding:7px;
}
JavaScript
function ticker() {
$('#ticker li:first').slideUp(function() {
$(this).appendTo($('#ticker')).slideDown();
});
}
setInterval(function(){ ticker(); }, 7000);