I am editing a website and playing a video for this website on the homepage. The video I play starts as autoplay and there is a button on the video using zIndex. When this button is triggered, the current video tag turns itself into a comment line and the other video becomes active. I used javascript and html coding for this. The problem is that when scrolling up and down the part of the website where these videos are visible, stuttering occurs. It looks like an FPS drop image. What can I do about it, what can I optimize? I work on wordpress and add this code as raw js to the page. *Rest of the page works normal when video frame is out of window view.

When i scroll down, everything is smooth but when i go up and see video a bit, here lag comes*

Here is my code:

<div class="video-wrap">
<button style="
    font-family: 'Font Proxima Nova Regular';
    font-size: 13px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: 1.5px!important;
    color: #fff;
    background-color: #E21C90FF;
    border-color: #E21C90FF;
    border-radius: 10px;
    position: absolute;
    z-index: 1;
    top: 78%;
    right: 38%;
">
    HOW PROGRAM WORKS?
  </button>
  <span></span>
  <video id="video1" style="position: relative; left: -13px; border-radius: 10px;" autoplay="autoplay" loop="loop" muted="" width="575" height="324"><source src="video1.mp4" type="video/mp4" />
</video>

<!--<video onloadstart="this.volume=0.25" controls id="video2" style="position: relative; left: -13px; border-radius: 10px;" loop="loop" autoplay="autoplay" width="575" height="324"><source src="video2.mp4" type="video/mp4" />
</video>-->
</div>

<script>
jQuery(function () {
  var videos = jQuery(".video-wrap");

  videos.on("click", function () {
    var elm = jQuery(this),
      conts = elm.contents(),
      le = conts.length,
      ifr = null;

    for (var i = 0; i < le; i++) {
      if (conts[i].nodeType == 8) ifr = conts[i].textContent;
    }

    elm.addClass("player").html(ifr);
    elm.off("click");
  });
});

</script>