首页 > 特效插件 > 表格弹出层 >  SexyLightBox弹出层播放视频正文

SexyLightBox弹出层播放视频

特效介绍


SexyLightBox弹出层播放视频。在本插件中,弹出层不光可以显示本地图片,引用本地文件,还可以播放视频。

更多关于SexyLightBox弹出层的使用:
白色风格动感的SexyLightBox弹出层jQuery代码
黑色风格动感的SexyLightBox弹出层jQuery代码
可嵌套的SexyLightBox弹出层引用本地和互联网内容

使用方法
1、在head引入下面的代码:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.easing.1.3.js"></script>
<script type="text/javascript" src="sexylightbox.v2.3.jquery.min.js"></script>
<link rel="stylesheet" href="sexylightbox.css" type="text/css" media="all" />
<script type="text/javascript">
$(document).ready(function(){
  SexyLightbox.initialize({color:'black', dir: 'sexyimages'});
});
</script>
调用函数参数说明:color为SexyLightBox弹出层边框的颜色,这里为黑色。dir是弹出层风格的路径,例如SexyLightBox弹出层背景图片、弹出层关闭按钮、上一页下一页按钮等。
2、在html的body里面写好引入的视频,或者是flash皆可,如下面的代码:
<div id="videito" style="display:none;">
    <object width="530" height="260">
        <param name="movie" value="http://player.youku.com/player.php/sid/XNjk3MjEzNzQ0/v.swf"></param>
        <param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param>
        <embed src="http://player.youku.com/player.php/sid/XNjk3MjEzNzQ0/v.swf" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="530" height="260"></embed>
    </object>
</div>
3、在需要点击弹出弹出层的a链接这样设置:
href="#TB_inline?height=270&width=530&background=#000&inlineId=videito" rel="sexylightbox" title="SexyLightBox弹出层播放视频"
href即表示需要弹出的内容,如inlineId="视频所在的外层的id",rel="sexylightbox"则是表示点击触发SexyLightBox弹出层。