18041 sujets

Questions générales et questions de débutants

[Résolu] Couper son video

Bonjour à tous.
Je suis en train de créer un site Web familiale et sur une page je souhaite, comme pour un diaporama de photos, avoir différentes vidéos (avec leurs sons réciproques) et n'avoir que celui de la vidéo consultée.

Ma page est réalisée, mais en cliquant sur le bouton, numéro de la vidéo à visualiser (1 ou 2 voir image jointe), j'entends toujours le son de la précédente. Tests réalisés sous Firefox, Chrome et Edge Chromium, tous en dernière version (Je suis sous Win 11 et j'utilise Dreamweaver)

Ce que j'obtiens, un "brouhaha" si je ne mets pas les vidéos précédemment visualisées en pause.

Donc comment n'avoir que le son de la vidéo sélectionnée ?

Par avance merci pour toute l'aide que vous pourrez m'accorder.
Bien à vous.
Bonjour,
tu tombes bien, on parle du lecteur audio/vidéo html 5 juste en-dessous.
J'ai cherché longtemps, mais j'ai trouvé :
https://stackoverflow.com/questions/19790506/multiple-audio-html-auto-stop-other-when-current-is-playing-with-javascript.
Si tu veux le mien, il fait à la fois l'audio et la vidéo. On ouvre une vidéo, avec le son, on passe à un lecteur audio, la vidéo s'arrête. Mais avant de copier bêtement, vas lire l'article du lien, c'est très instructif. 
[window.addEventListener("play", function(evt)
{
    if(window.$_currentlyPlaying && window.$_currentlyPlaying != evt.target)
    {
        window.$_currentlyPlaying.pause();
    } 
    window.$_currentlyPlaying = evt.target;
}, true);

Très très utile sur un site qui renferme de nombreux lecteurs audio éparpillés sur la page.
Modifié par Bongota (17 Apr 2023 - 11:21)
Meilleure solution
Super, merci pour le lien vers StackOverflow, je voulais justement te le demander. Simple et efficace. J'ai fait ceci pour que ce soit modulable (comme ça on met les sélecteurs que l'on veut) :
document.addEventListener('play', e => { // Un seul lecteur actif sur la page
  [...document.querySelectorAll('audio, video')].forEach((media) => media !== e.target && media.pause())
}, true)

Modifié par Olivier C (17 Apr 2023 - 18:46)
J'aurais pas été capable de faire ça...
Mais ne manque-t-il pas un ; après true)
En tous cas, ça fonctionne chez moi sur mon site.
Les points virgules sont fortement recommandés, mais en réalité facultatifs. Leurs absences peut poser des problèmes dans certaines situations, comme entre une variable et le début d'un tableau, mais il suffit de le savoir.

Et puis je suis une forte tête...
Olivier, dans la signature de son profil sur le forum, a écrit :
[...] Déteste les chevrons, les points virgules et les doubles quotes.

Modifié par Olivier C (17 Apr 2023 - 18:47)
Modérateur
Bonjour,

Olivier C a écrit :
Les points virgules sont fortement recommandés, mais en réalité facultatifs.

Les points virgules sont obligatoires en javascript pour la plupart des instructions, mais si on les oublie, les navigateurs et les minimifieurs les rajoutent ... comme ils peuvent (selon des règles qu'on appelle ASI qui signifie "Automatic Semicolon Insertion") !

On obtient donc un résultat cocasse. Quand on minimifie ses codes, la plupart des points virgules qu'on avait soigneusement omis lors du développement sont quand même présents dans le code. Et de même, quand un point virgule peut-être omis, un bon minimifieur le retirera du code. Le code produit par le minimifieur sera donc le même, qu'on ait mis des points virgules ou pas lors du développement (et en supposant qu'on n'ait pas fait d'erreur). Mais au final, le navigateur rajoutera quand même les points virgules absents avant exécution.

Même avec un QI de 200, il est bien difficile d'énumérer les cas où l'on peut se passer des points virgules en espérant que l'ASI rattrape le coup. Tandis qu'avec un QI de 100, on devrait être capable d'ajouter des points virgules à chaque fin d'instruction. N'ayant pas un QI de 200, je fais ce qui est à ma portée : je mets des points virgules systématiquement à la fin de chaque instruction (la seule exception étant après une accolade fermante). Smiley cligne

Il est par conséquent périlleux en plus d'être en grande partie inutile de ne pas mettre de point virgule en fin d'instruction !

Amicalement,

P.S. : pour se convaincre du péril, on pourra par exemple lire https://262.ecma-international.org/9.0/#sec-automatic-semicolon-insertion et en particulier la condition 1, dont l'application requiert de connaitre l'ensemble des règles de production de la grammaire javascript.
Mon Dieu qu'ai-je fait ? J'ai relancé le débat sur les points-virgules, ici, sur Alsacréations ! Je me vois déjà brûlé au pilori.

Je connais tes arguments Parsimonhi, et aussi la place des parseurs/minificateurs dans ce cas de figure.

Mais je suis une forte t... je m'incline Smiley boxe
Bonsoir Bongota,
cela correspond à mon attente et je suis en train d'analyser ce script afin de ne pas, comme tu le dis, bêtement copier ce dernier.

Bien à toi.
Daniel;
Olivier C a écrit :
Mon Dieu qu'ai-je fait ? J'ai relancé le débat sur les points-virgules, ici, sur Alsacréations ! Je me vois déjà brûlé au pilori.

Je connais tes arguments Parsimonhi, et aussi la place des parseurs/minificateurs dans ce cas de figure.

Mais je suis une forte t... je m'incline Smiley boxe

C'est moi qui ai relancé Smiley decu le débat
à mon corps défendant. J'en connais peu en Javascript, mais j'ai déjà pris en photo dans ma tête les scripts, avant de les comprendre. De ce fait, le point virgule manquant, je l'ai remarqué tout de suite (par rapport à d'autres codes, pas par rapport à son utilité réelle ou supposée).
Le navigateur en tous cas, s'en est bien passé Smiley cligne
Dankenobi a écrit :
Bonsoir Bongota,
cela correspond à mon attente et je suis en train d'analyser ce script afin de ne pas, comme tu le dis, bêtement copier ce dernier.

Bien à toi.
Daniel;

Bêtement étant à prendre au sens distrait, pas bête Smiley lol
Modérateur
Bonjour,

Olivier C a écrit :
Mon Dieu qu'ai-je fait ? J'ai relancé le débat sur les points-virgules, ici, sur Alsacréations ! Je me vois déjà brûlé au pilori.

C'était l'heure de la récrée ! Smiley lol Smiley lol Smiley lol

Amicalement,
Prévenir un modérateur
Répondre au sujet
Aller à