JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container">
<img src="http://www.yogadork.com/wp-content/uploads/2009/03/kitty-cat-yoga-leg.jpg" width="500" height="375" />
</div>
CSS
#container {
position : relative;
width : 500px;
height : 200px;
overflow : hidden;
}
#container > img {
position : absolute;
top : 0;
left : 0;
}
JavaScript
$(function () {
var $image = $('#container').children('img');
function animate_img() {
if ($image.css('top') == '0px') {
$image.animate({top: '-175px'}, 5000, function () {
animate_img();
});
} else {console.log('2');
$image.animate({top: '0px'}, 5000, function () {
animate_img();
});
}
}
animate_img();
});