jQuery Plugin To Play Audios On Scroll - AudioFade

AudioFade is a jQuery plugin that plays specified audio files with fade in / out effects based on scroll position.

How to use it:

1. Include the jQuery audiofade plugin after jQuery JavaScript library.

<script src="jquery.min.js"></script>
<script src="js/AudioFade.js"></script>

2. Add audio streams into your document using audio tag.

<audio loop id="scrollaudio" src="sound/1.mp3"></audio>
<audio id="scrollaudio2" src="sound/2.mp3"></audio>
<audio id="scrollaudio3" src="sound/3.wav"></audio>

3. Initialize the plugin with parameters.

• elementId: The jQuery selector contains the audio files.
• fadeIn: In pixels. When to start playing the sound, and if it has a fade, when to start fading in.
• fadeOut: In pixels. When the sound will start fading out. 
• fadeDuration: Default to 500px. How many pixels the fade will last.

// var someVariable = new AudioFade(elementId, fadeIn, fadeOut, fadeDuration).init();
var first = new AudioFade('#scrollaudio', 300, 1300, 700).init();

// With fade in & fade out effects.
var second = new AudioFade('#scrollaudio2', 2200, 3000).init();

// With no fade effect.
var third = new AudioFade('#scrollaudio3', 4000).init();

---

This awesome jQuery plugin is developed by KamboBlack. For more Advanced Usages, please check the demo page or visit the official website.