Responsive website with audio

audio

(Jim Avakian) #1

I have a website with 2 pages of the same audio files, one for phone and one for desktop. files are indivual songs. Seems like they are all loading at the same time, no matter what device i’m opening the site on. How can i have the song files preload only when the scene is opened.

Thank you,
Jim


#2

To turn off preloading for individual audio files, select the actual mp3 file in the resources library, and deselect ‘Preload’ at the bottom. The audio file will begin preloading if it exists on the scene as an audio element, or if the audio is played.


(Jim Avakian) #3

Thanks Daniel, my issue is that the files are individual songs placed on scenes, song files that have an external location. my apologies for not explaining properly. if i set preload to none, can i have them preload when entering a scene.
Thank you,
Jim


#4

If your audio files are hosted externally, you would just use the standard audio embed code within the inner HTML of a rectangle. Select the rectangle, and click Edit > Edit Inner HTML:

<audio id="myAudio" width="400" controls="controls" preload="auto">
    <source src="http://site.com/audio.mp3" type="audio/mpeg"> <!-- Safari and iPhone -->
    <source src="http://site.com//audio.ogg" type="audio/ogg"> <!-- Firefox and Chrome -->
</audio>  

The preload auto code:

preload="auto" 

…is what tells the browser to ‘attempt to preload this audio file so it is ready when the audio element is played’. It will only start this preload when the scene containing the audio element is opened.

The other options are none & metadata.


(Jim Avakian) #5

Thank you Daniel, your response is greatly appreciated. My last question regarding this “preload”. if I open the website on my computer, enter the scene with audio/songs; will the responsive 'ness of the design also load the mobile phone version/scene with the duplicate audio files as well - also preloading those files as well even though the width of browser doesn’t show that version? I hope I’m explaining this properly. … i can see the continuous downloading of files even after the site and scene is already open on my computer.
Once again, Thank you!

Jim


#6

The audio files will only load on scenes you are actively viewing when you have ‘preload’ unchecked for your audio files in the resource library.


(Jim Avakian) #7

Daniel, thank you for your help on this. I’m stuck, can’t find the ‘preload’ box to uncheck. Unless it’s a javascript. I’m using hype 3 pro, doesn’t seem to have the option available.
one note; mobile phone version doesn’t have an issue, it’s just iPad & Desktop.
Again,thank you!
Jim


#8


(Jim Avakian) #9

Dbear, Thank you! I don’t know how you guys do it, must have tons of patience. I’m beginning with this. My issue is that audio and video files are externally located. I have been creating boxes with html code to load these guys and that’s where i put the ‘preload’ to none. Ok! let me know if that’s it. And, sorry to you both for being a pain.
Thank you for your help.
Jim Avakian