Code
<script type="text/javascript" src="/js/jquery.totemticker.js"></script>
<script type="text/javascript">
$(function(){
$('#vertical-ticker').totemticker({
row_height : '100px',
next : '#ticker-next',
previous : '#ticker-previous',
stop : '#stop',
start : '#start',
mousestop : true,
});
});
</script>
<style>
#vertical-ticker{
height:400px;
width:400px;
overflow:hidden;
margin:0; padding:0;
-webkit-box-shadow:0 1px 3px rgba(0,0,0, .4);
}
#vertical-ticker li{
padding:35px 20px;
display:block;
background:#efefef;
color:#333;
border-bottom:1px solid #ddd;
text-align:center;
font-size:25px;
font-weight:bold;
font-family: Helvetica Neue, times, serif;
}
</style>
Code
<ul id="vertical-ticker">
<li>One Time</li>
<li>Baby</li>
<li>One Less Lonely Girl</li>
<li>Somebody to Love</li>
<li>Eenie Meenie</li>
<li>Never Say Never</li>
<li>U Smile</li>
</ul>
<a href="#" id="ticker-previous">Назад</a> / <a href="#" id="ticker-next">Вперёд</a> / <a id="stop" href="#">Стоп</a> / <a id="start" href="#">Старт</a>