Amélioration script fonctionnant sur IE pour lecteur mp3 intégré accessible non-

Signaler
Messages postés
9
Date d'inscription
dimanche 20 mai 2007
Statut
Membre
Dernière intervention
10 juillet 2010
-
Messages postés
381
Date d'inscription
lundi 12 novembre 2007
Statut
Membre
Dernière intervention
23 octobre 2014
-
Bonjour,

Je voulais proposer à l'écoute sur mon site des musiques perso mp3 par le biais d'un lecteur intégré dans mon site. Or, j'aimerai que ce lecteur soit totalement accessible aux non-voyants donc qu'on puisse arrêter à tout moment la lecture d'une piste par échap, qu'on y trouve un bouton stop, pause/lecture et volume.

Quelqu'un de mon entourage m'a passé le code avec script ci-dessous incluant un lecteur accessible et vraiment ça marche vraiment bien bien avec Internet explorer, le résultat était comme je le souhaitais, j'ai testé sur une de mes pages, c'était l'idéal.

Malheureusement, cela ne fonctionne pas avec Firefox...

Sauriez-vous par tout hasard trouver la faille et m'aider à l'améliorer pour le rendre accessible avec Firefox ? Qu'est-ce qui bloque chez Firefox d'après vous ? Car sur Firefox, que ce soit pour un non-voyant ou pour n'importe qui, la lecture n'est tout simplement pas possible, on ne voit même pas le lecteur...

Voici le code :
1. Entre les balises "<head>" & "</head>", insérer le code ci-dessous :

<script>
function lecteur(filename) {
Player.URL = filename;}
function stop() {
document.Player.controls.stop();}
function volumeplus(v) {
document.getElementById('Player').settings.volume+=v;}
function Volumemoins(v) {
document.getElementById('Player').settings.volume+=v;}
function pause() {
if (document.Player.playState==3) {
document.Player.controls.pause();}
else {document.Player.controls.play();}}
</script>

2. Toujours entre ces mêmes balises "<head>" & "</head>", insérer le code ci-dessous :

<style>
a {color: black; text-decoration: none;}
span {position:absolute; left:-1000px; width:200px; overflow:hidden;}
div {position:absolute; left:-1000px; width:200px; overflow:hidden;}
</style>

3. Juste sous la balise "", insérer le code ci-après :

<object ID="Player" width="280" height="45" CLASSID="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6">



</object>

4. Juste sous ce code, insérer le lien (rendu invisible) vers les contrôles pour mal-voyants :

Accéder aux contrôles de son pour déficients visuels

5. A l'endroit souhaité dans la page, insérer le lien qui déclenche la lecture du fichier. La subtilité est qu'il faut désigner ce dernier par son adresse internet. Dans le code qui suit, repérer :
onclick égal guillemet lecteur parenthèse ouvrante apostrophe
Changer l'intitulé du lien selon ce qu'on souhaite y faire figurer :

[# Intitulé du lien]



6. En fin de page, juste avant "", les contrôles pour non-voyants, (invisibles eux aussi) :



[# Volume +]
| [# Volume -]
| [# Pause]
| [# Stop]



Merci beaucoup de vos lumières et idées.

Bonne soirée.

5 réponses

Messages postés
6146
Date d'inscription
dimanche 21 décembre 2003
Statut
Modérateur
Dernière intervention
4 septembre 2013
9
Bonsoir,

Quel est le rapport avec Flash et l'ActionScript ?

Peg'
Messages postés
9
Date d'inscription
dimanche 20 mai 2007
Statut
Membre
Dernière intervention
10 juillet 2010

Désolée... Le site a planté à l'envoi du premier message j'ai dû recommencer et j'ai oublié de choisir la bonne catégorie...
Je ne trouve pas le lien pour éditer mon message...

Si un modérateur passait par là, pourriez-vous déplacer ce sujet SVP dans la partie php/web 2.0/compatibilité des navigateurs ?

Merci beaucoup par avance et encore toutes mes excuses...
Messages postés
6146
Date d'inscription
dimanche 21 décembre 2003
Statut
Modérateur
Dernière intervention
4 septembre 2013
9
Je te fais ça.

Peg'
Messages postés
9
Date d'inscription
dimanche 20 mai 2007
Statut
Membre
Dernière intervention
10 juillet 2010

Un grand merci à toi. ;)
Messages postés
381
Date d'inscription
lundi 12 novembre 2007
Statut
Membre
Dernière intervention
23 octobre 2014

Plusieurs remarques :

La balise pour insérer du javascript est :
<script type= "text/javascript">
<![CDATA[
... unescaped script content ...
]]>
</script>

La balise pour le style CSS est :
<style type ="text/css">
style css
</style>

Pour que les naviguateurs évitent de suivre un lien qui active une fonction javascript il faut rajouter return:false;

Ex :

[# Volume +]
| [# Volume -]
| [# Pause]
| [# Stop]



Voilà si cela peut aider.

++