JSFiddle - React, Tailwind, and code Playground

by lollero

HTML

<div class="Start">Play</div><div class="Stop">Stop</div>
<br /><br />
<p>Lorem Ipsum Dolor Sit Amet...</p>

JavaScript

var myTimeOut, Stop, stop_flag;

$('.Start').click( function () {
    stop_flag = 0;
    $('p').animate({ marginLeft: 200 }, 6000);
});

$('.Stop').click( function () {
    clearTimeout(Stop);
    stop_flag = 1;
    $('p').stop();
});



function Repeat() {
    
    if( stop_flag == 1 ){
        return;
    }
    else {
        $('p').show('slow').delay(400).hide('slow', function() {
            Stop = setTimeout( Repeat, 1100 )
        });
    }
                                            
}