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.anchi01.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.anchi01.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.anchi01.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.815994.com-3d彩报布衣电子报| www.173596.com-内蒙快三专家推号| www.4748.vip-中彩票强制捐款| www.971348.com-澳客手机彩票网下载| www.370017.com-网冠彩软件下载| www.625235.com-全民彩票是什么意思| www.699913.com-中国福彩开奖号| www.807886.com-黑桃k5分彩走势图| www.943178.com-福利彩票中奖名单| www.fm4.cc-内蒙古快三预测专家| www.667862.com-彩票事情-| www.775656.com-河北体彩站点申请| www.912401.com-11选5私彩害人| 尊彩www.900406.com| www.tw24.com-安徽快三游戏规则| www.1966.hk-99彩吧字谜图谜| www.932522.com-众信彩票靠谱吗| www.148889.com-10分快三彩票| www.590508.com-体育彩票500期| www.841808.com-中国福利彩票27号| www.od95.com-快三权威是不是真的| www.2371.net-七彩蛋电影网| www.152007.com-中华彩票-| www.259555.com-广西福彩中心| www.7291.biz-彩虹五号电池| www.772841.com-903彩票网-| www.377045.com-易彩乐快三看走势| www.8387.vip-福彩小助手可靠吗| www.292182.com-中福快三害死人| www.752113.com-ok彩票网能玩吗| www.933462.com-东彩骗局盈利| www.243563.com-体彩双色走势| www.389238.com-正规的网上彩票网站| www.576400.com-淘彩猫app-| www.790533.com-体彩快三11选5| www.143604.com-体彩大乐透摇奖时间| www.631953.com-优彩彩票能提现不| www.795707.com-甘肃晋彩快三| www.928118.com-彩色数码复印机报价| www.fw6.com-时时彩九码可以玩吗| www.198622.com-体彩11选五走势图| www.590128.com-七星彩查询-| www.6017.biz-玩3d彩票最高技巧| www.tv6.com-爱彩乐预测-| www.632041.com-七彩虹网驰2060| www.478077.com-移动彩票积分图| www.080772.com-8彩票app下载| www.og00.com-幸运彩下载-| www.8250.loan-江西快三玩法技巧| www.67200.com-福利彩票网上兑奖吗| www.09194.com-33彩票首页-| www.276673.com-菲律宾彩票信誉平台| www.85sq.com-足彩术语0.25| www.65988.com-福彩福彩快3助手| www.0156.cn-七彩色的寓意| www.7120.vip-博创彩票是不是骗局| www.690869.com-竞彩足球比分新浪网| www.794511.com-黑客重庆时时彩软件| www.870201.com-福彩3d规律研究院| www.932796.com-神圣彩票app下载| www.981947.com-福利彩票新闻| www.uo1.cc-今日彩票开奖大厅| www.337156.com-广西快三加奖方式| www.696039.com-七乐彩走势图乐彩网| www.518051.com-帝皇彩票网站| www.650747.com-水彩女孩教程| www.1225.wang-万豪国际博彩邀请码| www.541634.com-和田市体彩店| www.06fo.com-3g彩票是怎么买的| www.79oq.com-金星3d彩票论坛| www.1860.tv-帮别人下注彩票投注| www.131907.com-中国各地彩礼嫁妆| www.404025.com-休彩7位数开奖号码| www.536721.com-福利彩票有那些| www.671209.com-彩易网大乐透预测| www.746067.com-彩票预测大师apk| www.cai4511.com快三大小单双心得| www.188759.com-快三开中两个有钱吗| www.cai7890.com体彩甘肃11选5| www.913023.com-我去彩票站不能买了| www.995849.com-苹果竞彩-| www.gb67.com-彩票追号倾家荡产| www.587448.com-c8万彩开奖结果| www.gf.com-唯彩足球竞彩| www.173711.com-内蒙快三昨天走势图| www.tm44.com-3d天天彩图吧| www.56ak.com-彩之源是真还是假| www.4395.cn-01彩票自带app| www.128450.com-大奖网可以买彩票吗| www.230212.com-新盈彩骗局-| www.383028.com-福彩双色球网易杀号| www.520233.com-众彩易购有托嗎| www.515044.com-环球彩票平台登陆| www.613660.com-3d专业玩彩开机号| www.84502.com-彩钢板漆膜标准| www.894622.com-彩票字图片-| www.977301.com-唐河彩礼-| www.cp2203.com-快三吵群技巧| www.123231.com-欢乐彩网址-| www.199701.com-体彩481开奖视频| www.269193.com-砍龙团队刷彩流水单| 中华彩票www.9149h.com| www.540658.com-好运来彩票网站登录| www.660604.com-高频彩联盟官网| www.78xx.com-中国福利彩票中奖率| www.9118.biz-精准资料彩民福利| www.250379.com-zcp中彩票-| www.1972.top-彩票智慧预测| www.8100.biz-七星彩平台源码| www.9067.biz-七乐彩八个号多少钱| www.161398.com-汕头福彩-| www.92tw.com-然后批量找投彩网站| www.29mz.com-彩铅画女孩背影图片| www.ag1.cc-福彩快三北京| www.696759.com-皇家时时彩宝典| www.45673.com-台湾乐和彩开奖结果| www.077578.com-今天七星彩奖表图| www.134445.com-手机福利彩票下注| www.269252.com-大资本app彩票| 开心彩票www.089859.com| www.114432.com-体彩18136期| www.37rb.com-七乐彩天齐网杀号| www.244.mobi-彩票几天一期| www.906052.com-彩票沉迷破产| www.610992.com-彩票领导者安全吗| www.728691.com-体彩预测总汇| www.922557.com-招聘竞彩顾问| www.66xi.com-优游体彩-| www.041192.com-中福彩票网骗局揭秘| www.126207.com-菜彩票开奖查询| www.194755.com-有人拉你玩快三| www.6573.xyz-幸运号买彩票| www.033821.com-神彩争霸8最新下载| www.412111.com-彩钢瓦使用寿命| www.511570.com-神州福彩-| www.806269.com-彩民村公开六码三肖| www.0514.org-时时彩的玩法| www.708467.com-澳洲彩票兑奖| www.042058.com-竞彩足彩500网| www.lb14.com-天天彩票77678| www.671490.com-壹彩万网址-| www.226542.com-彩托-| www.42qz.com-苹果x原彩模式| www.075.in-福彩大转盘-| www.073353.com-彩票中奖人被杀| www.023686.com-七乐彩万能15码| www.832286.com-七彩影院苹果版下载| www.461422.com-彩票黄历预测今天| www.553751.com-彩快3彩票网站官网| www.783216.cc-保定彩票站招聘| www.854665.com-华夏彩票坑人| www.653281.com-福彩8炫彩奖金| www.548262.com-彩神通下什么软件| www.650270.com-彩虹伞打地鼠规则| www.733806.com-高频彩票调整解读| www.838513.com-七星彩开奖最新结果| www.912276.com-黑彩买到多少违法| www.li94.com-湖北福利彩票app| www.9963.vip-彩票那个奖金最高| www.239997.com-彩神xapp软件| www.790669.com-随机彩票生成器| www.876948.com-私彩漏洞刷钱| www.940571.com-飞鱼彩票技巧攻略| www.981864.com-七星彩随机选号码|