I am using JPlayer js library as an audio player. I want to change the content of a div at specific time of the song. In the code below currentTime
has the time.
I want to make something like
if currentTime=='00:15' alert('track is now on 15th second');
if currentTime=='00:45' alert('track is now on 45th second');
if currentTime=='01:20' alert('track is now on 01:20th second');
if currentTime=='02:15' alert('track is now on 02:15th second');
But i'm unable to take curretnTime
as a variable or assign its value to a variable. I'm newbie in js. Below is the actual code from jplayer
<script type="text/javascript">
var current_time;
$(document).ready(function(){
$("#jquery_jplayer_1").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
title: "Bubble",
m4a: "http://www.jplayer.org/audio/m4a/Miaow-07-Bubble.m4a",
oga: "http://www.jplayer.org/audio/ogg/Miaow-07-Bubble.ogg"
});
},
cssSelectorAncestor: "#jp_container_1",
swfPath: "/js",
supplied: "mp3, oga",
useStateClassSkin: true,
autoBlur: false,
smoothPlayBar: true,
keyEnabled: true,
remainingDuration: true,
toggleDuration: true,
cssSelectorAncestor: "",
cssSelector: {
currentTime: "#state1",
}
});
});
</script>
I have done that myself
<script type="text/javascript">
$(document).ready(function(){
$("#jquery_jplayer_1").jPlayer({
timeupdate: function(event) {
var time = event.jPlayer.status.currentTime;
if (time > 2) $('#comment').html('My first comment');
if (time > 4) $('#comment').html('My second comment');
if (time > 8) $('#comment').html('My third comment');
if (time > 15) $('#comment').html('My 4th comment');
if (time > 25) $('#comment').html('My 5th comment');
if (time > 35) $('#comment').html('My 6th comment');
if (time > 50) $('#comment').html('My 7th comment');
if (time > 60) $('#comment').html('My 8th comment');
if (time > 70) $('#comment').html('My 9th comment');
if (time > 90) $('#comment').html('My 10th comment');
if (time > 120) $('#comment').html('My 11th comment');
if (time > 150) $('#comment').html('My 12th comment');
if (time > 180) $('#comment').html('My 13th comment');
if (time > 200) $('#comment').html('My 14th comment');
},
ready: function () {
$(this).jPlayer("setMedia", {
title: "Bubble",
m4a: "http://www.jplayer.org/audio/m4a/Miaow-07-Bubble.m4a",
oga: "http://www.jplayer.org/audio/ogg/Miaow-07-Bubble.ogg"
});
},
cssSelectorAncestor: "#jp_container_1",
swfPath: "/js",
supplied: "mp3, oga",
useStateClassSkin: true,
autoBlur: false,
smoothPlayBar: true,
keyEnabled: true,
remainingDuration: true,
toggleDuration: true,
cssSelectorAncestor: "",
cssSelector: {
currentTime: "#state1",
}
});
});
</script>