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.hnhjgfj.net/'>
					<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.hnhjgfj.net/'>
						<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.hnhjgfj.net/'>
						<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.927812.com-306官方授权彩票| www.73791.cc-男彩票托的特征| www.049982.com-中国体彩排3| www.9509.in-今日运势一彩票| www.218718.com-分分快三正规吗| www.324268.com-七星彩论坛特区论坛| www.29715.cc-福彩湖北快乐十分钟| www.027621.com-广东体彩36选7| www.23046.com-王者彩票算不算赌博| www.6638.cm-双彩网张维新| www.49072.com-宁波足彩团队招聘| www.9486.cn-彩钢琉璃瓦机报价| www.893310.com-彩票大师最新官网| www.555002.com-吹吹七星彩本圈首页| www.871573.com-福彩双色球计划软件| 大玩家彩票www.84499h.com| www.a59.online-足彩必赢公式| www.97ld.com-福彩三d一句定三码| www.6611.cc-福利彩票几点钟开奖| www.32122.com-彩票店员工工资| www.970059.com-5k彩票手机领导者| www.539688.cc-福州福彩领奖地址| www.691635.com-烟台福彩交流群| www.322014.com-霍华德彩票中奖指南| www.86rt.com-彩票中奖你信吗| www.362985.com-徐汇区福利彩票点| www.526958.com-宝哥竞彩今晚推荐| www.669277.com-彩票有哪几种软件| www.784358.com-在手机上买七星彩| www.883871.com-天悦体彩下载| 凤凰彩票www.77801i.com| www.700793.com-足彩兑奖地点| www.794537.com-重庆时乐彩开奖号码| www.890711.com-青岛快三平台| www.968730.com-时时彩计划qq群| www.ay03.com-百姓彩票网被黑| www.xk87.com-鑫彩彩票平台| www.88ji.com-彩票平台骗-| 吉利彩票www.80075m.com| www.sd76.com-时时彩杀码公式| www.73ic.com-时时彩机器人怎么做| www.468785.com-怎么买彩票才能中奖| www.631030.com-福建好彩头要倒了吧| www.777624.com-12cc彩票-| www.890545.com-坤彩科技千股千评| www.985845.com-足彩胜负场开奖结果| www.nj54.com-足彩竞猜分析网站| www.88xu.com-澳门博彩垃圾信息| www.110479.com-鸿运彩票大发快三| www.196061.com-快三时时彩计划| www.022753.com-米兜彩票app下载| www.175809.com-彩神争8谁与争锋| www.008212.com-褔彩选4-| www.076869.com-高频彩票害人视频| www.158151.com-新浪网彩票首页官网| www.252508.com-99彩票害人不浅| www.441835.com-单注彩票上限| www.563073.com-中国体彩图片大全| www.518746.com-高频彩票输得快| www.56mp.com-糖果派对彩球图片| www.197878.com-中国彩票开奖走势图| www.365326.cc-德惠黑彩-| www.528022.com-体彩一年销售额多少| www.661653.com-竞彩易中技巧| www.783919.com-一分快三是谁开奖| www.872449.com-遵义市体育彩票中心| www.976936.com-结婚彩礼钱妈妈不给| www.gv15.com-彩票返点分配下级| 博乐彩票www.35918h.com| www.19106.com-万人彩票可信吗| www.708682.com-彩神lx坑人-| www.997256.com-哪个软件可以买足彩| www.pf29.com-彩七七骗局-| www.80rs.com-北控国彩合法吗| www.t31.club-天易彩票下载| www.974615.com-众彩网乐天-| www.288367.com-4k彩票-| www.421123.com-彩票站如何盈利| www.542168.com-彩绳怎么编头发一起| www.660512.com-阿里彩票手机app| www.749844.com-七星彩中4个号| www.827339.com-时时彩总和值玩法| www.933559.com-彩票中奖最多的省份| www.999941.com-中国福彩双色球时间| www.jo48.com-套彩金犯法吗| www.064567.com-甘肃快三奖金是多少| www.881493.com-辉煌彩票可靠吗| www.017611.com-易旺彩票网靠谱吗| www.21pj.cc-潍坊福彩中心| www.2168.com-七彩山鸡可以养吗| www.a35.org-广西快三单双预测| www.if8.com-vip彩票网站地址| www.im22.com-快三平台软件下载| www.280567.com-网易彩票可以买了吗| www.743967.com-无锡彩票中奖| 网易彩票www.26163c.com| www.675386.com-足球竞彩胜负计算器| www.254513.com-好彩官方下载| www.046006.com-500彩票代理申请| www.355389.com-彩乃奈奈百度云分享| www.639169.com-体彩店老板怎么兑奖| www.802256.com-有545彩票网么| www.962670.com-山东齐鲁福彩双色球| www.hc95.com-a3彩票下载安装| www.0506.club-福利彩票快乐彩开奖| www.9866.online仿古彩绘龙-| www.267231.com-搜狐彩票官网| www.492977.com-竞彩看盘术语解析| www.130980.com-结婚彩礼价目表| www.144899.com-安微快三爱乐彩| www.195897.com-易彩彩民异地登录| www.19128.cc-彩票中奖查看器| www.399677.com-福利彩票星期三| www.582082.com-彩神通金码关注号| www.718582.com-饭圈彩虹屁大全| www.929648.com-七星彩复式计算器| www.802948.com-手机能看彩票中奖吗| www.927107.com-万彩app下载| www.993167.com-福利彩票色子点数| www.yp98.com-韩国彩票在哪里买| www.35644.com-999彩票靠谱吗| www.92541.com-l立彩-| www.736127.com-一起彩票下载| www.397781.com-彩铅画花图片大全| www.q96.me-体彩怎样选号| www.8397.top-福运彩票下载安装| www.38468.com-福彩三d谜语太湖| www.xw56.com-彩宝官方苹果下载| www.8609.vip-31竞彩-| www.97tv.com-利盈彩票登陆| www.6491.cc-最专业彩票销售平台| www.56bb.cc-黔西南州体彩中心| www.678852.com-永利送彩金网站大全| www.788539.com-中国竞彩网官方主页| www.989113.com-福彩三d真实谎言迷| www.ku86.com-福彩3d更多开奖| www.113246.com-大奖彩票到底怎么样| www.894400.com-江苏福彩快3手机版| www.36847.com-幸运彩是不是黑平台| www.148836.com-河北冀彩宝客户端| www.237672.com-北京快三中奖| www.305361.com-买彩票害人-| www.365240.com-什么彩票app最好| www.429006.com-福彩刮奖青蛙过河| www.518600.cc-福彩王素英判多少年| www.317244.com-职业彩民群-| www.026887.com-三d彩吧下载| www.253797.com-快三出豹子的跨度表| www.09654.com-彩神通官方下载| www.52981.cc-时时彩停了怎么回事| www.45833.com-福豪彩下载-| www.1523.cn-大彩网首页官方网| www.997485.com-彩票哪一个比较好| www.g33.top-106彩票时时彩| www.37qv.com-牛彩网七乐彩杀号| www.89953.cc-内蒙古福彩3d字谜| www.089986.com-彩乐汇app-| www.187786.com-彩票规律破解图片| www.238256.com-中国快三第一门户网| www.529163.com-外围体彩怎么买法| www.325861.com-新浪竞彩足球比分| www.595350.com-虎扑足彩神棍区| www.906873.com-彩票分为哪几种类型| www.962627.com-旺旺彩票登陆|