css - css3 webkit animation stop on div:hover -
i try make animation webkit-animation , @-webkit-keyframes. have div animated child div inside.
and stop webkit-animation of parent when mouse on child.
any examples ?
thanks
unfortunately there no parent selector in css, see here. have use bit of javascript select parent , tell pause.
the pause declaration in css goes this:
-webkit-animation-play-state: paused | running;
the javascript (jquery, in case) this:
$(".child").hover( function(){ $(this).parent().css("-webkit-animation-play-state", "paused"); }, function(){ $(this).parent().css("-webkit-animation-play-state", "running"); });
see live demo here:
Comments
Post a Comment