JSFiddle - React, Tailwind, and code Playground

by H K

HTML

<div id="main" style="width: 300px;">
    <div class="item">
        <span class="info">سر خط خبر ها</span>
    </div>
</div>

CSS

body {
    font-family: monospace;
}
.item {
    float:right;
    background-color: red;
    width: 50%;
}
.info {
    float:right;
    background-color: green;
    display: block;
    text-align: right;
    width: 2%;
    height: 20px;
    overflow: hidden;
}

JavaScript

$(document).ready(function() {
    $(".info").animate({
        width: "100%"
    }, 3000);
});