HTML:
<div class="world" onmouseover="this.style.animation-name='a_Down' ">👋Hello, World!</div>
CSS:
.world {animation: a_Down 6s ease-in-out .5s}
это вырезка из рабочего (почти) https://codepen.io/oblominsk/pen/KKewqYg
В разных статьях предлагается менять один элемент стиля. А у меня целая анимация. В этом примере я пробовал подставлять ее элементы -- вроде animation-name: или animation-iteration-count: (чтобы она приобрела полный вид). Без animation-name: она работать не будет точно.
Анимация работает, но сама по себе , без внутреннего стиля в div, т.е. без onmouseover=.
Я знаю, то есть :hover , но также есть многочисленные Events , типа
onclick oncontextmenu onmouseover onmouseout onkeydown onkeyup onkeypress ...
Возможностей здесь больше.
В учебниках это вроде бы свойство JS --
<element onmouseover="myScript">
а animation: -- это же CSS. Как их совместить ?