전체 CSS에서 다음 애니메이션 (나타나고 사라지는 도구 설명 상자)을 재생할 수있는 방법이 있는지 다시 한 번 궁금합니다. 나는지연시 재귀 적으로 내용 표시/숨기기
-1
A
답변
0
당신은 (사용자 지정 애니메이션)이 사용하여 애니메이션 속성을 할 수있는 재귀 싶었다.
예 :
HTML
<div id="container">
<div id="animatediv">
</div>
</div>
CSS 여기
#container {
background-color: yellow;
display: inline-block;
padding: 40px;
}
#animatediv {
width: 100px;
height: 100px;
background-color: red;
position: relative;
animation-name: hideshow;
animation-duration: 3s;
animation-iteration-count: infinite;
animation-direction: alternate;
}
@keyframes hideshow {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
은 jsfiddle입니다 :
https://jsfiddle.net/fabio1983/j6jj9766/
또한 일을 확인하실 수 있습니다 자세한 내용은 페이지 :
시도한 코드와 연구를 게시하십시오. – thodic
@Fabio를 기반으로 한 몇 가지 테스트를 http://codepen.io/Komagain/pen/MpKEaO에 권고했습니다. 애니메이션은 poopinout이라고합니다 – Komagain