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.biranbalmer.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.biranbalmer.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.biranbalmer.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.39059.com-兴罗彩砖厂-| www.022819.com-体育彩票开奖排列5| www.104158.com-pp彩票是不是正规| www.168396.com-湖北快三跨度走势图| www.303164.com-上海十一选五爱彩乐| www.368867.com-古典美人彩铅画图片| www.448078.com-彩票老谢专栏| www.897404.com-体彩竞彩怎么玩| www.980171.com-竞彩足球数据分析| www.do69.com-澳门快三平台| www.tp96.com-彩票代理申请书| www.8hi.com-微彩吧怎么提现| www.54yd.com-玉溪体彩中心| www.717.cx-彩票兼职被骗了咋办| www.4235.top-七彩播放器-| www.8851.com-足彩8串1巨奖| www.86197.cc-55彩票正规的吗| www.029786.com-vip彩票软件下载| www.100155.com-互联网违规销售彩票| www.159063.com-爱乐彩彩票投注平台| www.257658.com-易旺彩票合法| www.323381.com-海南七星彩头尾码王| www.386173.com-彩票123ios-| www.508568.com-花画图片大全彩铅画| www.571616.com-福利彩票三等奖多少| www.635937.com-七彩印象16支香烟| www.753767.com-修改彩票网站余额| www.825511.com-上彩传媒-| www.887094.com-铭发彩票账号被冻结| www.962298.com-红神体彩网页| 金冠彩票www.49956b.com| www.dk75.com-基诺型彩票玩法技巧| www.sr11.com-福彩3d干期开机号| www.05oz.com-水溶性彩铅画教程| www.65rm.com-导师教你买彩票包赔| www.993.tv-福彩三d布衣字谜| www.6194.biz-山东11选5爱乐彩| www.05419.com-哪个网站买彩票| www.40671.com-幸运中福彩软件| www.78959.cc-网上可以卖彩票吗| www.ws22.com-贵卅快三和值走势图| www.37ul.com-彩票幸运号码推算| www.1662.in-彩票预测大师必中| www.6918.cn-好彩2什么意思| www.17211.cc-今晚可买什么彩开票| www.51969.com-体彩一周开几次| www.84985.com-体彩今日舟东全图| www.066921.com-3d福彩杀号-| www.465909.com-高频快开彩调整| www.546564.com-彩票站点申请| www.679535.com-大乐透杀号搜狗彩票| www.748456.com-红彩会彩票怎么样| www.805398.com-中国福利彩票推荐号| www.870447.com-三分彩最准计划| www.947514.com-外围足彩app排名| www.987189.com-彩票平台试玩账号| 幸运彩票www.luck808.com| www.gs30.com-湖北双色球快三| www.uy15.com-时时彩投注怎样稳赚| www.7xx.com-员工领奖中彩票中奖| www.51it.cc-正好彩票网胆码| www.348.cm-氵三d彩票字谜总汇| www.2845.cn-甜蜜蜜彩票糖果| www.7295.biz-小米彩虹5号电池| www.14210.com-今日竞彩足球比赛| www.50764.com-中国体育彩票排列5| www.86709.com-七星彩经典梦兆册| www.028925.com-内蒙体彩网和福彩| www.095058.com-福利3d彩票怎么买| www.147774.com-购彩堂彩票-| www.307538.com-全新韩国快三| www.363976.com-3分时时彩预测| www.433320.com-彩虹堂官方下载| www.514175.com-彩网站诈骗-| www.570608.com-七彩神仙鱼图片| www.627026.com-重庆时时彩独胆技巧| www.682864.com-中国正规彩票软件| www.747174.com-全球彩安卓-| www.798001.com-盈发彩票bug| www.857540.com-彩经彩票破解软件| www.907234.com-中国福彩快乐十分钟| www.961255.com-彩票坑了多少人| www.993695.com-希腊十分彩开奖号码| www.cai708.com-快三中奖助手免费版| www.gd12.com-激励人买彩票的句子| www.ub95.com-五分快三官方| www.5mm.com-竞彩中奖有税吗| www.44zn.com-彩虹-3无人机| www.007.loan-至尊争霸彩票假不假| www.2312.cc-七乐彩爱彩-| www.6789.pw-体彩大乐透新浪| www.08633.com-彩票梦想站官方网站| www.50701.com-篮球彩票怎么买玩法| www.88332.cc-春天彩票是真的吗| www.029900.com-众彩网排列五走势图| www.093499.com-全天重庆彩计划红旗| www.141641.com-彩票杀龙啥意思| www.200696.com-昨晚彩票开什么号| www.259149.com-中国足球竞彩app| www.317644.com-下载吉林快三开奖图| www.363881.com-沈河区福利彩票| www.398345.com-彩软软件-| www.659343.com-博彩免费源码| www.756197.com-彩吧p3试机号| www.833578.com-南粤36好彩3开奖| www.886106.com-正规外围足彩网站| www.993646.com-足球体彩玩法有哪些| 超级彩票www.976506.com| www.cs33.com-重庆时时开奖乐彩网| www.qo00.com-广西快三输了怎么办| www.8sy.com-出售博彩源码| www.44np.com-彩掌柜app下载| www.94ca.com-福利彩票怎样玩| www.1614.vip-爱玩彩票下载安装| www.8265.biz-红包彩票官网| www.18949.com-福利彩票助手| www.48424.com-佳能彩色复印机| www.83166.cc-3d高频彩是真是假| www.020625.com-时时彩源码技术论坛| www.072176.com-彩票实体店-| www.120913.com-三d福彩-| www.169138.cc-福彩快三是骗局吗| www.285883.com-新快三网址-| www.351033.com-网易不能买彩票了| www.402219.com-好彩客幸运28贴吧| www.486549.com-彩票庄家追杀| www.542398.com-双彩网3d论坛| www.621016.com-红旗彩票用户登录| www.669978.com-狂想p3彩票字谜| www.725433.com-快3彩票网站彩网址| www.787754.com-彩客化学创始人| www.841895.com-福彩五行属性| www.887499.com-釉下彩鉴别-| www.966039.com-今日福彩中奖号码| www.995887.com-好彩店彩票怎么了| VIP彩票www.898338.com| www.en32.com-百度乐彩-| www.qf73.com-体彩app二维码| www.v23.biz-中港彩票网抢红包| www.29te.com-天津体彩十分| www.95gm.com-多彩投欺骗-| www.1337.org-体彩福彩开机号| www.6364.biz-乐彩网33-| www.00012.cc-怎么进入大盈彩票| www.41588.cc-彩票天天存天天送| www.74755.cc-彩票推荐号码| www.005425.com-916彩票下载| www.050152.com-彩票奖金规则| www.128330.com-中彩双色球综合走势| www.178801.com-江苏e球彩开奖公告| www.233398.com-快中彩北京体彩| www.285908.com-足球竞彩彩票| www.408788.com-体育足彩aop| www.490605.com-体彩五p开奖结果| www.541022.com-彩票网站开发多少钱| www.611773.com-福彩网点充值| www.660507.com-上海五星体育竞彩| www.725432.com-浙江体彩飞鱼论坛| www.775663.com-石家庄福彩助学| www.838616.com-彩色纸箱印刷生产| www.881077.com-广西体彩中奖号码| www.934501.com-动物福彩网-| www.965647.com-买彩票哪个软件好| www.991071.com-彩之-|