Description
- play audio on hover image
- you can adjust volume, loop,..
- view demo – password: abc
- buy me a coffee
#1. Install Code
If you use Personal/Basic Plan and your plan doesn’t support Injection, you can see #2.2
#1.1. First, you need to edit Image Block > Click Attach Link
At URL > Choose File
Upload Audio file
Result like this
#1.2. Hover on Page where you added Image Blocks > Click Gear icon
Click Advanced > Paste this code
<!-- 05.26c04v1 Play Audio in Hover Image -->
<script>
window.AUDIO_HOVER_CONFIG = {
loop: true,
volume: 0.8,
fadeInDuration: 300,
fadeOutDuration: 400,
mobileUseTap: true
};
</script>
<script src="https://code.beaverhero.com/imageblock/0526c04v1playaudioonhoverimg.js"></script>
#2. Customize
#2.1. You can change all options here
<script>
window.AUDIO_HOVER_CONFIG = {
loop: true,
volume: 0.8,
fadeInDuration: 300,
fadeOutDuration: 400,
mobileUseTap: true
};
</script>
#2.2. If you use Personal/Basic Plan and your plan doesn’t support Injection, you can add a Markdown Block to current page.
Then use this code into Markdown.
<script>
window.AUDIO_HOVER_CONFIG = {
loop: true,
volume: 0.8,
fadeInDuration: 300,
fadeOutDuration: 400,
mobileUseTap: true
};
</script>
<script src="https://code.beaverhero.com/imageblock/0526c04v1playaudioonhoverimg.js"></script>
