HTML5视频播放器向下滚动固定在页面右下角位置

自动将HTML5视频播放器在页面向下滚动时，将其固定在页面右下角位置的jquery和CSS3效果

完整源代码下载：

https://download.csdn.net/download/edsoki/21717243

1、引入jquery文件

<scripttype="text/javascript"src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>

2、HTML

<div id="videoBox" class="box">

  <video width="400" controls>
    <source src="sample.mp4" type="video/mp4"> 
  </video>

</div>     

3、CSS样式

#videoBox {border: 10px solid #212223; transition: 0.5s;}
video { width: 100%; vertical-align: bottom;}
 
#videoBox.in { animation: ac 1s;}
 
#videoBox.out { position: fixed; bottom: 0; right: 0; width: 300px; z-index: 999; animation: an 0.5s;}                

效果如下：