Bene, ho fatto qualche verifica visualizzando i vari slideshow con i diversi browser.
Questi sono i file:
/audio/audio_01.mp3
/audio/audio_02.mp3
/audio/audio_03.mp3
/audio/audio_04.mp3
/audio/audio_05.mp3
Ho da darti una brutta notizia, ma anche qualcuna buona.
IE9 fa lo schizzinoso. A quanto pare non digerisce nessuno di quei file. Non ho idea del perché ma presumo dipenda da qualcosa nel tipo di codifica o nella compressione di quei file.
Tieni presente che IE9 supporta HTML5 e per questo motivo lo script utilizza il metodo "Audio", a differenza delle versioni meno recenti di IE per le quali, non supportando quel metodo, sarà utilizzato il metodo "embed" (HTML4).
Il problema di lettura di quei file è relativo solo quando con IE9 si utilizza il metodo "Audio", invece con "embed" il problema non si presenta e i file mp3 sono eseguiti regolarmente per tutte le versioni di IE.
A questo punto si può pensare di forzare l'uso del metodo "embed" per qualsiasi IE, dato che comunque funziona ugualmente (e in questo caso anche meglio del metodo "Audio").
Direi quindi di apportare qualche piccola modifica allo script.
Per chiarezza posto l'intero script (che andrà sostituito per intero col precedente). In effetti è cambiata solo la condizione che stabilisce l'uso di un metodo o l'altro:
codice:
var bgsound,srcaudio = "audio/audio_01.mp3";
if("Audio" in window && navigator.appName != 'Microsoft Internet Explorer'){ // browser con supporto HTML5 (escluso IE)
// NOTA: Col metodo "Audio" alcuni tipi di file mp3 (presumo dipenda da un qualche tipo di codifica) non vengono eseguiti da IE9,
// quindi forzo l'esclusione di tutte le versioni di IE (anche quando "Audio" è supportato) a preferenza dell'uso del metodo "embed".
//
bgsound = new Audio(srcaudio);
$(bgsound).attr({
controls: false
, loop: true
});
bgsound._vol = {on:1, off:0};
}else{ // browser meno recenti (e tutte le versioni di IE)
bgsound = document.createElement("embed");
$(bgsound).attr({
src: srcaudio
, loop: true
, autostart: false
, hidden: true
}).appendTo("body");
bgsound._vol = {on:0, off:-3000};
}
bgsound.run = function(run){
run&&this.play();
$(this).stop().animate({volume: run?this._vol.on:this._vol.off}
, 1500
, function(){!run&&("pause" in this)&&this.pause();}
);
};
gallery.isSlideshowRunning&&bgsound.run(true);
gallery.default_play = gallery.play;
gallery.default_pause = gallery.pause;
gallery.play = function(){gallery.default_play();bgsound.run(true)};
gallery.pause = function(){gallery.default_pause();bgsound.run(false)};
});
Chiaramente non avendo possibilità di testare su altri browser, non ho idea se il sistema sia totalmente cross-browser. Ad esempio su Opera potrebbe non funzionare l'esecuzione dell'audio, perché non è supportato il formato mp3 sul tag audio (da quanto ho letto supporta solo i file wav e ogg). In tal caso il si potrebbe migliorare il sistema integrando ulteriori metodi che siano supportati dai vari browser. Ma credo che per il momento si "sufficientemente" cross-browsing.
Riguardo la velocità di caricamento della pagina, è la seconda che hai detto:
- il caricamento è rapido perchè la riproduzione dello slideshow ha inizio PRIMA che il file mp3 sia stato completamente caricato (un po' come avviene con youtube)?
In linea di massima lo script (e quindi la creazione del tag che va a caricare il file audio) è eseguito ad ultimo, dopo che viene caricato il resto della pagina. Per tale motivo non si notano rallentamenti visibili nel caricamento degli slide.
Ad ogni modo si potrebbe notare un rallentamento nell'avvio e nell'esecuzione dell'audio se, appena aperta la pagina, si manda in esecuzione lo slideshow, perché il file audio potrebbe non essere stato caricato completamento.
Chiaramente può influenzare la velocità della propria connessione e la grandezza dello stesso file audio. Ma direi che usando file dell'ordine di 2 o 3 mega, attualmente, non credo ci siano particolari rallentamenti nella maggior parte dei casi.