Image Fade in , Audio Load, Movie load, Redirect with JQuery and HTML5
OK so that was a mouth full. I have previous use this forum and with the help of it members mad some really great stuff. ( Thanks Jake) So this is what we are working on now..Basically we have all the elements working but i want to add another and I am not quite sure how to do it so any help would be appreciated. Basically I want to add another image fade in before the redirect function kicks and redirects the site.
Here is the code:
Thanks in advance..
<script type="text/javascript">
var events=["abort","canplay","canplaythrough","durationchange","emptied","ended",
"error","loadeddata","loadedmetadata","loadstart","pause","play","playing",
"progress","ratechange","readystatechange","seeked","seeking","stalled",
"suspend","timeupdate","volumechange","waiting"]
$.fn.volumizer=function(o){ // assumes the user has no controls!
return this.each(function(){
var lastSeconds=-1,
media=this
$(this).on('timeupdate',function(){
var seconds=Math.floor(this.currentTime)
if (seconds>lastSeconds && o[seconds]){
var rule=o[seconds],
aniSeconds=rule[0],
volume=this.volume,
finalVolume=rule[1]*volume,
stepVolume=(finalVolume-volume)/aniSeconds
console.log(rule,volume,finalVolume,stepVolume)
for(var second=0;second<aniSeconds+1;second++)
(function(tVolume){
setTimeout(function(){
media.volume=tVolume
console.log(tVolume)
},second*1000)
})(volume+(stepVolume*second))
}
lastSeconds=seconds
})
})
}
$(function(){
$('#copy,#splash').hide()
$('#splash').fadeIn(2000)
// great debugging code to see media events!
// $('audio,video').on(events.join(' '),function(e){console.log(this.tagName,e.type)})
$('audio').on({
canplaythrough:function(){
var a=this
$('#splash').fadeOut(35000,function(){
// a.pause()
$('#splash').hide()
$('#copy').fadeIn(function(){
$('video').each(function(){this.play()})
})
})
}
}).volumizer({25:[35,.0001]})
$('video').on({
ended:ended
})
$('object').each(function(){ // older IE kluges!
var count=0,object=this
bind(object,'qt_begin',function(){
bind(object,'qt_ended',function(){
count>0?ended():(count++)
})
})
})
})
function bind(o,e,f){
if ( document.addEventListener )
o.addEventListener(e,f,true)
else
o.attachEvent('on'+e, f);
}
function ended(){
location.href="http://yoursite.com/"
}
</script>