krpano的layer和hotspot是两个神奇的元素,它们支持的文件类型非常广泛,嘻嘻,其实也就支持四种: SWF、JPG、PNG、GIF。
textfield是krpano一个神奇的插件,它有一个神奇的属性HTML,不过textfield的Flash版本插件仅支持极少量的HTML4和CSS代码。大部分HTML5代码的工作只能在JS插件下完成。
我们今天介绍如何在layer中嵌入一个网站在线视频。
HTML5的代码
1 2 3 4 5 6 7 8 |
<layer name="video_3" devices="html5" keep="true" url="plugins/textfield.swf" html="[iframe width='560' height='315' src='//www.youtube.com/embed/iQx28i6w0jc' frameborder='0' allowfullscreen][/iframe]" width="640" height="480" padding="0" align="center" /> |
这是一个youtube视频的页面,你要做的就是到视频详情页,点击分享按钮,把通用代码中src的部分复制出来。其他视频网站的分享大同小异,最明显的特点是带有iframe标签,然后你找到src的部分,复制出来就可以了。经测试,可以正常播放。
附带一个html属性的用法:我们在用textfield插件生成文本时,希望能让文本的处理更加多样化,例如部分文字是蓝色部分文字是黑色这样。而不需要用到两个textfield插件。
解决方案:在文本的部分使用简单的CSS样式设置。该办法兼容flash和HTML5。
1 |
html="黑色 [font color='#0000FF' style='color:#0000FF;']蓝色[/font] 黑色 [font color='#FF0000' style='color:#FF0000;']红色[/span] 黑色" |
但Flash就麻烦多了。本人验证了多个国内视频网站,没有一个能正常播放的,估计是klaus没有研究国内的视频Flash播放器吧。下面放上一个测试可用的vimeo视频。需翻墙。
1 2 3 4 5 6 |
<layer name="video_4" devices="flash" keep="true" url="http://vimeo.com/moogaloop.swf?clip_id=93491995" align="center" maskchildren="true" onloaded="registercontentsize(640,480);" /> |
关键是url一段,url本应该放的是SWF的视频播放器,不过目前看来对国内的视频网站是基本播放不了的。大家要是找到方法可以告知我。