1
0
Fork 0

improve non-js audio fallback

This commit is contained in:
Rhiannon Morris 2021-05-25 16:03:05 +02:00
parent d4e6d5b6d8
commit f440410b76
2 changed files with 13 additions and 4 deletions

View File

@ -67,7 +67,7 @@
<dl>
<dt> how to say
<dd>
<a id=soundlink href=#>
<a id=soundlink>
<span class=ipa>nɪs</span>, <span class=ipa>nɪ</span>
</a>
<audio id=miku>
@ -75,6 +75,9 @@
<source src=media/niss-nisse.ogg type=audio/ogg>
(<a href=media/niss-nisse.mp3>listen</a>)
</audio>
<noscript>
(<a href=media/niss-nisse.mp3>listen</a>)
</noscript>
<dt> prons <dd title='she for niss, he for nisse'> it or they
<dt> quantity <dd> 2
@ -90,7 +93,13 @@ window.addEventListener('DOMContentLoaded', () => {
let link = document.getElementById('soundlink');
let miku = document.getElementById('miku');
if (typeof miku.play == 'function') {
link.addEventListener('click', e => { miku.play(); e.preventDefault(); });
function playMiku(e) {
miku.play();
e.preventDefault();
}
link.href = '#';
link.addEventListener('click', playMiku);
}
});
</script>

View File

@ -140,13 +140,13 @@ dd {
}
}
a {
a[href] {
color: hsl(196deg, 100%, 85%);
font-weight: 800;
text-decoration: none;
transition: color 0.2s ease-in-out;
}
a:hover {
a[href]:hover {
color: hsl(50deg, 100%, 82%);
}