lean2016's questions

I am performing the same actions for different elements and I want to know if the code could be shortened and how to do it. This is a page with 3 videos that I want to play or stop playing on hover or exit.

The HTML code for the videos is the following (which I repeat 3 times with different id):

controls = [];
player1 = new Plyr('#player1', {
  controls
});
window.player1 = player1;
player2 = new Plyr('#player2', {
  controls
});
window.player2 = player2;
player3 = new Plyr('#player3', {
  controls
});
window.player3 = player3;
$("#demo1btn").hover(function() {
  player1.play();
});
$("#demo1btn").mouseout(function() {
  player1.stop();
});
$("#demo2btn").hover(function() {
  player2.play();
});
$("#demo2btn").mouseout(function() {
  player2.stop();
});
$("#demo3btn").hover(function() {
  player3.play();
});
$("#demo3btn").mouseout(function() {
  player3.stop();
});

<div class="btn p-0" id="demo1btn">
  <video class="video-fluid" id="player1" poster="fotos/demo1.jpg" playsinline loop>
        <source src="demo1.mp4" type="video/mp4">
      </video>
</div>

I calculate that if I go for the .video-fluid class instead of the IDs, I could start all 3 together with a for... but I'm not sure if there would be any conflict with the window.player or how it would be done, and the same with The hover and mouseout, I know I have to go through the btn class, but inside I got lost with the selector to identify the element with the $(this "#video-fluid") and it didn't work out.

Could someone please help me with this?

I want to give the same style to 2 particular links and my current code is the following:

a#id1:link {color:darkgray;}
a#id1:hover {color:white;}
a#id1:active {color:red;}
a#id1:visited {color:black;}

a#id2:link {color:darkgray;}
a#id2:hover {color:white;}
a#id2:active {color:red;}
a#id2:visited {color:black;}

How can I summarize it? I tried something like a#id1#id2:link {color:darkgray;} but it doesn't work.

Greetings, Leandro.

I'm making a website with background audio, and in chrome I can't mute it from the tab icon, this doesn't happen in other browsers, like firefox, in firefox I mute it from the tab and it works, but in chrome, albeit It shows me the little speaker icon (it recognizes that there is an audio playing) it doesn't let me mute it, it doesn't do anything when I click on it.

Any ideas?

Regards, Leandro.