QQ客服
当前位置 : 首页 > 代码 > 网页特效 > 提示框/浮动层/弹出层 > jQuery layer图片视频列表弹窗插件

原创商用 jQuery layer图片视频列表弹窗插件

jquery基于layer弹窗插件制作图片视频列表布局,点击视频弹窗播放效果代码。div css js 清晰,均有备注,方便使用,下载即可使用,
分享到微信朋友圈
X
[声明]该素材是本站付费买断的作品代码,享受著作权?;?,未经允许请勿转载,否则追究相应的法律责任。

使用方法:

1、head引入css文件

<link href="css/style.css" rel="stylesheet" type="text/css" />

2、head引入js文件

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/layer/layer.js"></script>

3、body引入HTML代码

<div class="video">
	<div class="container">
		<div class="index-title">
			<h2>观看视频介绍</h2>
			<a href="#">全部视频</a>
		</div>
		<div class="video-wrap">
			<div class="vr-big">
				<div class="inner" data-iframe='http://www.jcjdgy.com/'>
					<img src="images/large-001.jpg" alt="">
					<i class="play"></i>
					<div class="text">
						<h3>新零售视频介绍</h3>
						<p>通过视频介绍,你将更加深入了解什么是新零售</p>
					</div>
				</div>
				<a href="#" class="link">了解详情</a>
			</div>
			<div class="vr-right">
				<div class="vr-small">
					<div class="inner" data-iframe='http://www.jcjdgy.com/'>
						<img src="images/large-002.jpg" alt="">
						<i class="play"></i>
						<span class="text">到家视频介绍</span>
					</div>
					<a href="#" class="link"></a>
				</div>
				<div class="vr-small">
					<div class="inner" data-iframe='http://www.jcjdgy.com/'>
						<img src="images/large-003.jpg" alt="">
						<i class="play"></i>
						<span class="text">收银台视频介绍</span>
					</div>
					<a href="#" class="link"></a>
				</div>
			</div>
		</div>
	</div>
</div>

<script type="text/javascript">
$(".video").on("click",".inner",function(){
	var $this = $(this);
	var video = $this.attr("data-iframe");
	layer.open({
	  type: 2,
	  title: false,
	  closeBtn: 1, //不显示关闭按钮
	  shade: 0.3,
	  skin: 'layer-alert-video',
	  area: ['900px', '563px'],
	  anim: 0,
	  content: [video, 'no'] //iframe的url,no代表不显示滚动条
	});
});
</script> 


[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系客服QQ:2447402004给予处理。
举报×
举报原因:

相关代码

二维码
意见反馈
×
×

注册

QQ注册 立即下载 新浪注册 立即下载

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了
彩乐分析 www.717275.com-福彩网是什么样子的| www.6097.cm-釉上彩过程-| www.62559.com-七星彩票开奖统果| www.34941.com-1爱彩乐-| www.892682.com-k8彩票app-| www.js91.cc-网上买彩票输了几万| www.9xy.cc-中华彩票报纸电子版| www.1533.vip-福彩大家乐二维码| www.24696.cc-古代人物彩铅画图片| www.009298.com-166彩票下载| www.7086.cc-七彩建设怎么样| www.44408.cc-彩66安卓下载安装| www.070373.com-牛彩彩票正规吗| www.268131.com-福彩3d奖金计算表| www.494897.com-lol赛事博彩| www.619093.com-5oo万足球彩票| www.777544.com-中信彩票-快3| www.hs69.com-竞彩足球app苹果| www.1fp.cc-爱乐透彩票旧版下载| www.5022.in-幸运彩票天天中奖| www.97520.com-nba彩经预测分析| www.257712.com-保定体彩中心| www.450004.com-篮彩竞猜推荐| www.411742.com-彩票会被别人复制吗| www.556873.com-彩票算是一种赌博么| www.14161.com-延敖足彩-| www.110002.com-王牌彩票是否正规| www.342360.com-3d杀一码家彩论坛| www.9716.top-彩宝的功效和寓意| www.062219.com-万彩网骗局-| www.82246.com-足彩19031对战| www.852711.com-足彩310报纸发行| www.986407.com-3d彩票吧百度贴| www.bo01.com-152彩票ios-| www.e45.club-福彩3d好123| www.66oi.com-七星彩头尾资料| www.1652.top-彩吧分析论坛| www.592151.com-荣耀彩票网站| www.069389.com-彩神x的下载链接| www.318040.com-三分时时彩在线开奖| www.876265.com-正规的彩票销售平台| www.968754.com-彩世界时时彩软件| www.cai8234.com分分快三怎么玩稳赚| www.uc71.com-365全民彩票下载| www.88hf.com-黑彩规律能破解吗| www.4455.cc-购彩网赚钱是真的吗| www.08pk.com-728彩票手机测试| www.3873.xyz-竞彩交易量合成交比| www.70369.com-下载一品彩票| www.10ds.cc-123会员彩票官网| www.vj24.com-约彩彩票ios| www.m78.top-黑彩平台怎么制作| www.40fw.com-七星彩走势近30期| www.840898.com-足彩分析预测网易| www.7417.vip-沈阳竞彩店-| www.223388.cc-江苏省福彩-| www.401953.com-七星彩145-| www.567472.com-福利彩票3d42期| www.693157.com-购彩软件哪个好| www.871694.com-博牛彩票可靠吗| www.78gp.com-彩票中奖推送| www.334485.com-彩票提现失败| www.462950.com-如何知道彩票真假| www.799725.com-体育彩票考试知识| www.93ng.com-公司要求平分彩票1| www.560318.com-699彩票真的假的| www.ub21.com-体彩名词灯谜| www.939672.com-玩彩哪个好-| www.ho5.com-高频彩合买-| www.385595.com-ll彩票坑死我了| www.460411.com-体彩排列五出的杀号| www.656195.com-融彩网是真的假的| www.808022.com-新浪竞彩草莓推荐| YY彩票www.yy63.com| www.of67.com-福州体彩11选五| www.56wl.com-张家口彩票站| www.969932.com-广西快乐双彩复式表| www.ns67.com-彩票平台如何报警| www.f96.club-中国人在国外中彩票| www.450477.com-海南七星彩庄家| www.610669.com-1519彩票平台| www.861156.com-北京时时彩开奖走势| www.4561.pw-福彩3d开奖频道| www.36696.com-澳门分分彩官网| www.095228.com-浙江12选5爱乐彩| www.307667.com-派彩每日推荐大乐透| www.502940.com-欧洲杯竞彩网| www.678117.com-贵烟好彩进价| www.885073.com-合肥福彩中心电话| www.ca72.com-福彩排列五-| www.09py.com-星彩彩票app| www.82lr.com-中闰彩吧网更懂彩民| www.7209.loan-宝乐彩票app| www.83358.cc-入门买什么彩票最好| www.712925.com-秒速时彩开奖官网| www.801023.com-大众彩票登录| www.874361.com-大发快三和值预测| www.959646.com-金鸡团队彩票计划| www.ap8.cc-福彩排列七-| www.115643.com-中国体彩客服电话| www.202619.com-贵州体彩兑奖地址| www.357970.com-守号中奖彩民心得| www.632738.com-福利彩票大乐透中奖| www.fb29.com-网络彩票快3骗局| www.964329.com-低成本的竞彩2串1| www.362080.com-台湾乐透彩资料网| www.58ev.com-692彩票下载| www.184618.com-湖北福彩快3一定牛| www.583029.com-3d福彩彩宝网| www.we22.com-吉林市彩票中大奖| www.10062.com-福彩快三一注多少钱| www.41699.com-速赢彩计划-| www.019685.com-天天爱奖彩票合法吗| www.949364.com-彩票大奖都是假的吗| www.066159.com-彩吧助手专业走势图| www.700756.com-博彩打水套利生涯| www.803756.com-彩500uu直播| www.894544.com-3d新走势图彩经网| www.959124.com-彩票99官方下载| 大赢家彩票网www.339531.com| www.lm11.cc-河北快三投注对照表| www.2jq.cc-你们身边有中彩票吗| www.350131.com-福彩3+d开奖结果| www.982182.com-3d字谜总汇新彩网| www.152783.com-彩票开奖11选5| www.3532.com-博彩送28免-| www.78907.com-福彩刮刮乐好运十倍| www.0250.loan-时时彩奖金对照| www.117088.com-新手竞彩足球怎么买| www.194376.com-正规彩票网-| www.260182.com-买十分快三技巧| www.330270.com-湖北福彩3d开机号| www.392058.com-江西体彩店-| www.507391.com-福彩33期中奖号码| www.587002.com-连红彩票没了| www.669531.com-数学预测彩票| www.741393.com-28彩票网站-| www.809014.com-微彩官网登录| www.880390.com-彩票套利对打安全吗| www.939735.com-众盈娱乐五分快三| www.983654.com-北京快三有多少期| www.kh7.cc-福彩3d蓝琪儿断组| www.mv45.com-申请福彩代理销售点| www.b61.vip-福利彩票3p走势图| www.456781.com-六今彩幵码结果| www.014022.com-七星彩61-| www.010458.com-彩票中奖最多多少钱| www.078039.com-鸿福彩票骗局| www.131601.com-彩票未领-| www.192288.com-双彩论坛-| www.252923.com-老时时彩开奖号| www.311986.com-红旗彩票快3| www.367123.com-中国彩吧3d开机号| www.441508.com-招聘彩票销售人员| www.521295.com-七乐彩历史中奖号| www.578434.com-佛山市体育彩票| www.636710.com-彩虹符号emoji| www.717525.com-兰花彩铅怎么画| www.777991.com-987彩票下载| www.835291.com-好彩香烟四种口味| www.883785.com-博友彩官方网站| www.936556.com-福彩自助终端机政策| www.975274.com-彩票中奖图片最新| 小米彩票www.101377.com|