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.lyddedu.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.lyddedu.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.lyddedu.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天

知道了
彩票123现在叫什么名字 www.833599.com-双彩球开奖洁果| www.962104.com-五分快三计划群骗局| www.gb7.com-彩票玩法双色球| www.wb25.com-人人猜球可以买彩票| www.19ov.com-潍坊体彩店转让| www.7603.vip-个人七星彩软件下载| www.34439.com-下载安徽福彩| www.89762.com-公司年会彩票| www.113331.com-福彩3d一新彩网| www.200065.cc-新浪手机彩票网| www.286731.com-智能彩票号码生成器| www.526706.com-彩票分什么彩种| www.612565.com-彩牛美缝剂代理| www.697278.com-七星彩怎么样选号| www.786553.com-vlp彩票-| www.871831.com-利彩平台365团队| www.cp3908.com-赵公明3d彩票预测| www.qw44.com-老时时彩360走势| www.34tj.com-七星彩开了多少年了| www.1770.club-好彩会员资料| www.06798.com-福彩蓝精灵21| www.69631.com-金彩网246网| www.085324.com-甘肃快三和值单双| www.172733.com-彩票软件大全| www.305664.com-也买彩app官网| www.410789.com-足彩赔率怎么算奖金| www.533353.com-更多彩种购彩| www.683908.com-实体店彩票app| www.778155.com-手机app购彩违法| www.907768.com-够力七星彩奖表6| www.972426.com-彩铅画五官教程| www.mh23.com-亚博彩票网址多少| www.29ut.com-福彩3d出啥号| www.0434.cn-优购彩app下载| www.8763.top-立彩票预测分析推荐| www.61302.com-太公鸡七星彩| www.044618.com-美团可以买彩票| www.150611.com-买彩票用哪个软件| www.511191.com-往彩虹天堂-| www.696300.com-008网彩票-| www.792594.com-安阳彩票大奖得主| www.918270.com-海南七星彩玩法介绍| 彩82www.c9218.com| www.iq90.com-彩乐网app下载| www.k35.cc-上海快三速查表| www.63js.com-彩金能换黄金吗| www.4374.cn-家彩论坛3d-| www.08423.com-广西北海快三走势图| www.134722.com-解福彩臧机图| www.319860.com-中国福彩游戏机| www.421994.com-彩票总站网站| www.569632.com-七乐彩一尾数走势图| www.674929.com-体彩归民政局吗| www.783022.com-o38彩票软件| www.889727.com-彩票没中顺口溜| www.981175.com-易彩网开奖公告| www.gf63.com-福建体彩36选7| www.l85.net-南方双彩走势图大全| www.66vq.com-杏耀彩票可信吗| www.0684.vip-彩八仙有没有苹果版| www.48901.com-旧版高手特彩吧资料| www.008399.com-贵州快三遗漏查询| www.090555.com-内蒙休彩11选5| www.168121.com-快三胆拖金额| www.327520.com-彩票图表-| www.404358.com-彩票5000万网页| www.515512.com-什么网站买七星彩| www.587589.com-合肥体彩竞彩店| www.662657.com-彩名堂计划ios| www.806363.com-时时彩开奖插件| www.885491.com-七星彩中奖号码| www.998164.com-海口七星彩开心网| www.tf2.cc-福彩开奖直播| www.xw38.cc-彩票下载苹果| www.34dj.com-福彩3d周几开奖| www.2777.vip-彩88大乐透预测| www.9029.biz-多肉值物彩叶麒麟| www.66998.com-领奖彩票官网| www.063271.com-彩票店内还能卖什么| www.173252.com-江苏快三注册| www.279053.com-福彩3d和值字谜| www.397340.com-80彩票app骗局| www.514410.com-苹果x开不开原彩| www.585608.com-没财命的中彩票好吗| www.667127.com-彩票33下载手机版| www.761585.com-山东省体彩中心地址| www.cp2806.com-福建快三开奖一定牛| www.uh36.com-彩票是否真实| www.44ug.com-纯彩票平台出黑| www.0004.link-彩票交易记录| www.22362.com-拿彩礼当嫁妆| www.67744.com-重庆时时彩万能五码| www.050143.com-彩票店做黑彩挣钱吗| www.150390.com-新浪彩票3d论坛| www.246009.com-淮安市体彩-| www.323553.com-彩票开奖查询金七乐| www.416322.com-uc注册彩票安全吗| www.519914.com-2343彩票app| www.588993.com-彩先知首页-| www.661763.com-足彩容错表-| www.808329.com-丽彩集团-| www.881270.com-博彩合法app| www.974184.com-彩运来官网注册| www.rw91.com-三分彩开奖不一样| www.8zh.com-中国体育彩票资料| www.70yq.com-3d彩票字谜总汇| www.1166.live-彩票分析预测表格| www.23599.cc-彩神8快1-| www.67732.cc-博彩诈骗破案案例| www.053530.com-彩乐乐专家杀码预测| www.151663.com-多乐彩票-| www.254487.com-北京快三平台| www.325354.com-狂想彩票系列谜语| www.434991.com-体育彩票好做吗| www.555552.com-希咲彩-| www.663810.com-中国彩票大全| www.767251.com-时时彩怎样投都是输| www.881034.com-人人平安彩票靠谱吗| www.984130.com-彩店宝彩票肇星| www.cp9395.com-合法彩票平台| www.ks45.com-乐米彩票-| www.c16.vip-公告彩票中奖i| www.36og.com-一百万彩票的网址| www.3732.xyz-七星彩今晚的头尾| www.9346.cm-乐透啦彩票官网登录| www.64748.com-竞彩让平干货| www.042907.com-网上购买足彩软件| www.144493.com-腾龙时时彩计划下载| www.266211.com-安徽快三走势图软件| www.376764.com-体彩开奖助手开机号| www.525013.com-彩票思维推理| www.665083.com-欢迎使用078购彩| www.731081.com-福彩邀请码-| www.796686.com-众博彩票无故钱没了| www.867757.com-七星彩开奖是几点| www.927361.com-一般彩票是几位数| www.978158.com-彩钢板围挡铁皮厚度| www.gc21.com-浙江快乐彩官网| www.wm81.com-999彩票网-| www.08mv.com-哆力七星彩表下载| www.71aj.com-福彩任选五开奖结果| www.0602.top-黑龙江体彩时时彩票| www.8758.top-腾讯1.5分彩官网| www.36855.cc-高频彩能玩吗| www.76168.com-彩票体育-| www.021450.com-彩名堂最新版| www.082551.com-2118彩票-| www.138387.com-360彩票基本走势| www.208561.com-销售彩票专业术语| www.272829.cc-pc蛋蛋是正规彩票| www.414618.com-彩生活物业现状| www.507080.com-小易体彩大乐透预测| www.568547.com-昆明七彩云南第壹城| www.628079.com-彩虹e台最新节目表| www.688444.cc-广东体彩店申请| www.755862.com-新粤彩彩图论坛| www.882043.com-新加坡快三开奖| www.993282.com-网购体彩-| www.cai9455.com兰州快三开奖号| www.ij79.com-福彩3dqq群-| www.ww11.cc-永利皇宫棋牌送彩金| www.04ul.com-竞彩理财计划| www.62lw.com-nba篮彩让分盘| www.0043.pw-山东体彩网软件|