LLIypuk,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.shows div {
display: none;
width: 100px;
height: 100px;
float: left;
background-color: #FFCC66;
}
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(function() {
var show = 1;
$('.main-menu').click(function(){ console.log(show)
$('.shows div').stop(true, true);
if(show ^= 1){
$('.shows div:last').fadeOut(300, function me (){
$(this).prev().fadeOut(300, me);
});
}
else{
$('.shows div:eq(0)').fadeIn(300, function to(){
$(this).next().fadeIn(300, to);
});
}
});
});
</script>
</head>
<body>
<input name="" type="button" value="click" class="main-menu">
<div class="shows">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
</div>
</body>
</html>