码迷,mamicode.com
首页 > 其他好文 > 详细

用chrome观看体验镜像电影

时间:2017-03-04 17:36:16      阅读:124      评论:0      收藏:0      [点我收藏+]

标签:sel   color   下载   border   images   block   isp   cti   cte   

<select>

         <option>left</option>

         <option selected>right</option>

         <option>above</option>

         <option>below</option>

</select>

<video autoplay="true" loop="true" width="480" height="270">

         <source src="http://www.tofei.cc/comments/4_BlowVido/video/BigBuckBunny_640x360.mp4">

         <source src="http://www.tofei.cc/comments/4_BlowVido/video/BigBuckBunny_640x360.ogv">

</video>

<style>

video{

         -webkit-box-reflect:right;

}

.left{

         margin:0 0 0 480px;

}

.above{

         margin:270px 0 0 0;

}

select{

         width:120px;

         height:30px;

         background:#FF6100;

         color:white;

         margin:15px;

         border: 1px solid #999999;

         display:block;

}

</style>

<script>

var video = document.querySelector(‘video‘);

var select = document.querySelector(‘select‘);

select.addEventListener(‘change‘, function() {

         video.style.webkitBoxReflect = this.value;

         video.className = this.value;

});

</script>

 

【内容展示有限,可以加群下载,群文件会定期更新学习资料,以及练手小案例】
【web前端交流学习群21】群号598399936【定期更新群文件】

技术分享

 

用chrome观看体验镜像电影

标签:sel   color   下载   border   images   block   isp   cti   cte   

原文地址:http://www.cnblogs.com/luludehuhuan/p/6501736.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!