если я хочу создать анимацию, когда я показываю и скрываю список, как я могу сделать это в приведенных ниже кодах и могу ли я использовать setInterval {} ;? - PullRequest
0 голосов
/ 16 июня 2020

это мой код, и я хочу использовать анимацию, например, если я нажму на div, его id = 'div', чтобы показать список, но один за другим и слева направо, я не хочу, чтобы он отображался напрямую и все в одно и то же время, поэтому я думал, могу ли я использовать setInterval или setTimeout, но я все еще не знаю, как я могу его использовать, или если это невозможно.

<html><head><title></title></head>
<body onload="Hide();">

<div id="div" onclick="showList();"> <!-- this the div when i click on it i want to show and 
 hide the list below-->
<hr><hr><hr>  
</div> 
<div id="li">
<li id="l1"><a href="##">Home</a></li>   <!-- this which i want to hide and show it -->
<li id="l2"><a href="##">Offers</a></li>
<li id="l3"><a href="##">List</a></li>
<li id="l4"><a href="##">Books</a></li>
<li id="l5"><a href="##">Help</a></li>
<li id="l6"><a href="##">Setting</a></li>
</div>    
<script>
/*this function to show and hide the list and i want  
to add some codes to makes an animation when it hides and shows 
the list*/ 
function showList(){                      
var show = document.getElementById("li"); 
if(show.style.display==="block"){
show.style.display = "none";                       
}
else {
show.style.display="Block";

}  
}
function Hide(){ //this function for unload(); which i put it in <body>
var show = document.getElementById("li");     
show.style.display="none";
}       
</script>     
</body>
</html>
...