JSFiddle - React, Tailwind, and code Playground

by tea4two

HTML

<script src="http://labs.ft.com/wp-content/uploads/2010/03/jquery.ticker.js"></script>
<div id='ticker1'>
  <ul>
    <li>日本語１のテキストです。</li>
    <li>日本語2のテキストです。</li>
  </ul>
</div>

CSS

body {
    background: #ccc;
}
#ticker1 {
    width: 90%;
    overflow: hidden;
    padding: 5px;
    height: 50px;
    background: #000;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
#ticker1 li {
    float: left;
    color: #fff;
}
#ticker1 ul {
    width: 300px; overflow: hidden;}

JavaScript

$(function() {
    var ticker = $('#ticker1').ticker({pxpersec:50});
    var newid = ticker.addMsg('わー');
    setTimeout(function() {
        ticker.removeMsg(newid);
    }, 60000);
});