jquery+willesPlay实现自定义皮肤支持关灯模式的h5视频播放器效果代码

代码语言:html

所属分类:多媒体

代码描述:jquery+willesPlay实现自定义皮肤支持关灯模式的h5视频播放器效果代码

代码标签: jquery willesPlay 自定义 皮肤 支持 关灯 模式 h5 视频 播放器

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
    
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/reset.min.css">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.3.3.4.css">
    
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/willesPlay.css">
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.1.11.min.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/willesPlay.js"></script>
</head>

<body>
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div id="willesPlay">
                    <div class="playHeader">
                        <div class="videoName">Tara - 懂的那份感觉</div>
                    </div>
                    <div class="playContent">
                        <div class="turnoff">
                            <ul>
                                <li>
                                    <a href="javascript:;" title="喜欢" class="glyphicon glyphicon-heart-empty"></a>
                                </li>
                                <li>
                                    <a href="javascript:;" title="关灯" class="btnLight on glyphicon glyphicon-sunglasses"></a>
                                </li>
                                <li>
                                    <a href="javascript:;" title="分享" class="glyphicon glyphicon-share"></a>
                                </li>
                            </ul>
                        </div>
                        <video width="100%" height="100%" id="playVideo".........完整代码请登录后点击上方下载按钮下载查看

网友评论0