最代码广告位
oopslwb的gravatar头像
oopslwb2015-01-15 09:58:18

jQuery点击视频缩略图切换视频播放网页特效源码下载

jQuery点击视频缩略图切换视频播放网页特效源码下载 

特效说明:一款jQuery点击缩略图切换视频播放网页特效,点击缩略图并选中当前选项,播放该缩略图对应视频网页特效。该特效调用优酷视频地址,也可以调用本地视频地址,兼容性好。(兼容测试:IE6及以上、Firefox、Chrome、Opera、Safari、360等主流浏览器)

使用方法:添加HTML代码:
将<!--效果html开始-->......<!--效果html结束-->之间的html和js代码;放在<body></body>之间。

JS代码编写:

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    // 切换视频
    $(".video-list li").click(function(){
        var obj = $(this);
        var video_id = obj.attr("video");
        var path = obj.attr("id");
        var vid = obj.attr("vid");
        $(".js_videoCon").hide();
        $("#js_videoCon_"+vid).show();
        obj.addClass("now").siblings().removeClass("now");
    });
});
</script>

演示地址   代码出处及下载地址


打赏

文件名:videoFocus.zip,文件大小:84.869K下载
  • /
      • /videoFocus
        • /videoFocus/51RGB海量优秀学习资源.txt
          • /videoFocus/images
            • /videoFocus/images/bodyBg.jpg
            • /videoFocus/images/bodyBg2.jpg
            • /videoFocus/images/bodyBg3.jpg
            • /videoFocus/images/icon-video.png
            • /videoFocus/images/video_1.jpg
            • /videoFocus/images/video_2.jpg
            • /videoFocus/images/video_3.jpg
顶部客服微信二维码底部
>扫描二维码关注最代码为好友扫描二维码关注最代码为好友