<code lang="css">
<style>
img{
position:absolute;
width: 220px;
transform: scale(-1,1) ;
}
.reverse{
transform: scale(1,1);
}
</style>
</code>
</head>
<body>
<img src="/img/самолет.png" id="plane" alt="">
<code lang="javascript">
<script>
const plane = document.getElementById("plane");
let n = 0;
const maxTravel = window.outerWidth-plane.offsetWidth;
let direction = 0;
plane.style.left = "";
function movePlane(){
if(n < maxTravel && direction === 0) {
n++;
plane.style.left = `${n}px`;
}else {
direction = 1;
n--
plane.style.left = `${n}px`
plane.classList.add('reverse')
};
if(n<0){
direction = 0;
plane.classList.remove('reverse')
}
};
setInterval(movePlane, 5);
</script>
</code>
</body>
</html>
function movePlane(){
if(n < maxTravel && direction === 0) {
n++;
plane.style.left = `${n}px`;
}else {
direction = 1;
n--
plane.style.left = `${n}px`
plane.classList.add('reverse')
};
if(n<0){
direction = 0;
plane.classList.remove('reverse')
}
};
setInterval(movePlane, 5);