Forum Discussion
Background Music Demo
Hello Anne,
I am by no means a JavaScript expert however, I have been working on applying this process to one of my own courses. Based on previous conversations in this thread I was able to get it working on my own course with this code:
//load the scripts dynamically into the head of the document
function add_line() {
var line = document.createElement("audio");
var head=document.getElementsByTagName('body')[0];
line.type = "audio/mp3";
line.src="";
line.id="bgSong" ;
line.autoplay = true;
line.loop = true;
head.appendChild(line);
}
//but we only want to add these once!
if(document.getElementById('bgSong')==null){
add_line();
var audio = document.getElementById('bgSong');
audio.volume = 1.0;
}
var player = GetPlayer();
this.Location= player.GetVar("location");
var audio = document.getElementById('bgSong');
audio.src=location+"NAME OF SONG HERE.mp3";
audio.load();
audio.play();
Using the code above at the JavaScript executed on the first slide has been working for me. You should be able to copy and paste it into your own trigger on that first slide. Make sure you edit the NAME OF SONG at the bottom. Additionally in your "location" trigger you only need to start at story_content. You do not need to include all of the information before that part. So the text in your location trigger should only be: story_content\WebObjects\6RU7elBBAGE
Hopefully these changes may be able to help you!
~Alex
Hi Alex,
After tried this code, I thought there is a better way to add background music
I think manny of us also use this methode so I prefer this one because more simple
Edit the output of Course Publish and add this JS:
<audio src="1.mp3" id="bgSong" preload="auto" autoplay loop></audio>
1. Right click on the html5 & open with Notepad or Notepad ++
2. add this js into html5 output right between the <body> and <!-- 360 --> like this picture below:
3. Save & exit
And don't forget :
1. to change the "1.mp3" to your audio file name. Mine is 1.mp3
2.paste "1.mp3" into the publish output folder where you edit the hmtl5
-Anderson-