Möchten Sie wissen, wie Sie ein div nach einer Reihe von CSS3-Animation ausblenden. Hier ist mein Code:Hide div nach CSS3 Animation
html
<div id='box'>
hover me
</div>
css3
#box{
position:absolute;
top:200px;
left:200px;
width:200px;
height:150px;
background-color:red;
}
#box:hover{
-webkit-animation:scaleme 1s;
}
@-webkit-keyframes scaleme {
0% { -webkit-transform: scale(1); opacity: 1; }
100% { -webkit-transform: scale(3); opacity: 0;display:none; }
}
Hier ist die jsfiddle Probe zur besseren Veranschaulichung:
http://jsfiddle.net/mochatony/Pu5Jf/18/
Irgendeine Idee, wie man die Box dauerhaft, am besten ohne Javascript versteckt?
Ich benutze Chrome, und ohne das JS-Snippet kann das CSS3 selbst das 'display' nicht auf' none' ändern, auch nicht mit -webkit-animation-fill-mode: forwards; '. – qbolec