Из этой ссылки у меня есть хороший маленький анимированный Svg Bell. Переместите мышь на SVG, и колокол качается вперед и назад. < /P>
Все, чего не хватает, это звук! Отсюда пробовал различные советы, но я не могу получить звук, чтобы играть, когда мышь переживает SVG.
Ring the bells
Hover over me!
Your browser does not support the audio tag.
< /code>
Но я пытаюсь заставить ее играть, когда мышь переживает SVG, у которого уже есть настройка падения в настройках SVG. Может быть, это проблема? Какие -нибудь советы, пожалуйста?
Bell
Ring the bells
Hover over me!
Your browser does not support the audio tag.
#bell {
transform-origin: 0 -45px;
}
svg:hover #bell,
svg:hover #bell-clapper {
animation-duration: 0.5s;
animation-delay: -0.25s;
animation-iteration-count: infinite;
animation-direction: alternate;
animation-timing-function: ease-in-out;
animation-name: ring;
}
@keyframes ring {
from {
transform: rotate(-20deg);
}
to {
transform: rotate(20deg);
}
}
var audio = $("#audio")[0];
audio.play();
var audio = $("#audio")[0];
$("h1").mouseenter(function() {
audio.play();
});
Подробнее здесь: https://stackoverflow.com/questions/797 ... n-svg-bell
