Как закрепить полноразмерное видео с помощью ScrollMagic - PullRequest
0 голосов
/ 04 февраля 2020

У меня есть успех закрепления элементов в ScrollMagi c, кроме этого полноэкранного видео. Может кто-нибудь сказать мне, что я делаю не так, пожалуйста? https://codepen.io/lschneiderman/full/BaNBdPb

<div class="screen bg-transparent height100" id="">

</div>  
<div class="screen bg-transparent height100" id="">

</div>  

<div class="screen bg-transparent height100" id="">

</div>  

<div class="screen height100" id="scenevid2">
    <video id="vid2">
      <source src="video/1-hospital-1.mp4" type="video/mp4">
    </video>    
</div>

<div class="screen bg-transparent height100" id="fade15">

</div>  

<div class="screen bg-transparent height100" id="">

</div>

.screen {
    position: relative;
    width: 100%;
    z-index: 100;
    float:left;
}
.height100 {
    height: 100vh;
}
#vid2 {
    width: 100%;
    height: auto;
}

var scene = new ScrollMagic.Scene({
    triggerElement: "#vid2",
    duration: height*3, 
    triggerHook: 0, 
    reverse: true 
})
.setPin("#vid2").addTo(controller);
...