<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;
}
更多资料免费分享加群 120342833 验证回答 ZZ
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>
