问题描述
场景最近苹果发布了iPhone5C和iPhone5S,哥在官网观看了高端大气上档次的视频产品演示,虽然没马上决定卖肾入手,不过还是对这种产品演示的方式产生兴趣,决定动手模拟一个。原理利用保利威视视频播放器的video_bg_color参数,让播放器的底色置为白色,不会再有黑边框了,例如video_bg_color=ffffff。保利威视播放器还有一个参数为ban_bar_keep_play_btn,隐藏进度条,只留一个中间的播放按钮。实现先到保利威视后台,播放器设置里面挑选一个上档次的视频播放器,我挑了最后一个“现代”风格的。然后再把右侧菜单栏的几项打钩的都去掉,片尾设置里面,把“返回片头”勾上。现在准备将视频代码拷贝黏贴到网站了,在代码的flashvar的value里面,额外加入两个参数video_bg_color=ffffff&ban_ata_bar_keep_play_btn=on<divclass="overlay"id="video"onclick="hideme()"><divstyle="position:absolute;left:0px;right:0px;top:0px;bottom:0px;width:100%;height:100%;visibility:visible;padding-top:77px;TEXT-ALIGN:center;">播放器代码放这里</div></div>还需要在页面加入一段css,<styletype="text/css">.overlay{background-color:#fff;position:fixed;width:100%;height:100%;top:0px;left:0px;z-index:1000;display:none;}</style>最后加一段javascript<script>functionshowvideo(){document.getElementById("video").style.display="block";}functionhideme(){document.getElementById("video").style.display="none";}</script>这就完成了,点击链接或图片的时候调用showvideo就可以在网页中间秀一个大视频,点击空白位置就可以隐藏掉视频。最终演示http://www.polyv.net/help/v-manual/2013/0911/129.html
解决方案
解决方案二:
(・ิω・ิ)goodjob!