JSFiddle - React, Tailwind, and code Playground
by ozzon91
CSS
.supermen {
width: 140px;
height: 370px;
position: absolute;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
.super_back {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
-o-transform: rotate(270deg);
transform: rotate(270deg);
}
JavaScript
(function() {
var $img = $('<img>', {'class': 'supermen', 'alt':"super"});
$img.on('load', function() {
goMen();
function goMen() {
$('.supermen').animate({'top': '100px', 'left': $(window).width()+300+'px'}, 5000, function() {
$(this).addClass('super_back');
$(this).animate({'top': '50px', 'left': -4000+'px'}, 5000, function() {
$(this).removeClass('super_back');
setTimeout(goMen, 5000);
});
});
}
});
$img.attr('src', "http://mail.r13.org/im/super.png").appendTo('html');
})();