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.sino-agri-tj.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.sino-agri-tj.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.sino-agri-tj.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天

知道了
1分快三 www.298765.com-幸运彩票3550| www.0283.cn-餐厅送彩票-| www.682925.com-中彩在线能玩吗| www.4242.wang-七彩汇苹果下载| www.58717.cc-55125彩吧图| www.119431.com-一定牛快三遗漏号码| www.108457.com-福彩新彩吧手机版| www.257551.com-江苏福彩快三开奖查| www.207157.com-幸运快三计划数据| www.sy23.cc-七星彩奖表图808| www.5156.site-体育彩票黑彩网站| www.5169.win-天津市福彩领奖地址| www.650389.com-nba博彩规则| www.90mk.com-bwin博彩规律| www.72133.cc-富彩彩票怎么做代理| www.067124.com-彩票店吃票-| www.170760.com-甘肃快三预测号码表| www.800830.com-福彩3d天天开奖吗| www.928647.com-安微福彩快3走势图| www.993568.cc-足彩胜负彩怎么领奖| www.gu31.com-彩77官网下载地址| www.7ar.cc-员工中彩票608万| www.1950.cc-福彩3d怪字怪帖| www.9199.tv-航天彩虹股票牛叉| www.64578.com-姜姜竞彩app| www.046068.com-c彩83下载-| www.33274.com-篮球体彩分析| www.99872.cc-太子彩票网页版| www.076138.com-我国的体育彩票是| www.ns42.com-上海体育彩票排列三| www.019603.com-体育彩票湖南赛车| www.293003.com-钢炮福彩-| www.000299.com-嘉兴体育彩票网官网| www.088950.com-快三盘是什么样子的| www.181678.com-快三走势图安徽| www.271911.com-中原彩票平台| www.358230.com-怎样下载时时彩宝典| www.456141.com-彩虹六号黑镜小技巧| www.567735.com-彩票cp36-| www.900079.com-51彩票首页-| www.xd2.cc-福彩青海快三| www.6383.in-福彩计划独胆| www.827057.com-南方彩票安全吗| www.899193.com-福彩江苏-| www.972632.com-广东竞彩网-| www.ac44.com-河南福彩发行中心| www.957191.com-金利彩票被骗的人| 彩吧www.586960.com| www.ol87.com-体彩与福彩哪个靠谱| www.5ys.com-分分彩免下载| www.2698.com-c777彩票下载| www.670525.com-新浪彩票查询| www.778151.com-迪士尼彩乐园ii| www.866283.com-体彩在线投注app| www.926323.com-江西体彩客户端| www.978136.com-彩钢棚做法详细图| www.cp7992.com-快三开奖中奖规则| www.536092.com-买哪种彩票奖金高| www.672126.com-特彩吧旧版正| www.824892.com-杨震足彩微博竞彩猫| www.891567.com-彩票如何网上推销| www.951195.com-福体彩票全部开奖| www.993582.com-火箭彩票网平台| www.rs2.cc-彩神88app官网| www.321655.com-彩票数据统计软件| www.299749.com-凤彩网彩票双色球| www.398653.com-最新胜负彩对阵表| www.047813.com-江苏体育彩票| www.129454.com-彩运来官网手机登录| www.362657.com-发彩染发膏-| www.405239.com-山东彩民3亿元巨奖| www.543225.com-有什么彩票网站| www.767711.com-湖南福彩网快乐十分| www.536020.com-网上哪种彩票真实| www.189328.com-内内蒙快三开奖结果| www.430908.com-竞彩宣传口号和图片| www.91595.cc-蓝色炫彩油画| www.78281.cc-福利彩开奖今天| www.045399.com-彩神通苹果版| www.571595.com-好运彩票合买平台| www.519689.com-世界各国彩票介绍| www.02834.com-彩票中奖哪里领| www.76713.com-正版福利彩票下载| www.6205.vip-3d今天彩圣字谜| www.22003.com-体彩排列三论坛| www.83578.cc-彩票分析师年收入| www.5188.pw-天津体彩即开型彩票| www.39139.com-彩神310383-| www.89889.com-江苏休育彩票七位数| www.447316.com-初始者买足彩技巧| www.58176.cc-官方彩gz-| www.452678.com-体彩最大奖5.7亿| www.565124.com-彩票竞彩客户端| www.758653.com-彩票赚流水钱违法吗| www.954410.com-福建彩票22走势图| www.cp5152.com-上海快三技巧| www.ur05.com-哪个彩票论坛好| www.705771.cc-彩发发最新版| www.772962.com-彩吧助手app下载| www.846306.com-体育竞彩资讯| www.900778.com-彩吧p3图谜第三版| www.958470.com-福彩快3推荐号| 凤凰彩票www.77802b.com| www.512040.com-就业时报三d天天彩| www.627191.com-体彩7位数开奖号码| www.448789.com-山西省福彩中心电话| www.681780.com-彩票软件上中一等奖| www.840042.com-竞彩360足球| www.961574.com-牛蛙彩票30码资料| www.658588.cc-中彩乐群英会走势图| 500彩票www.50052m.com| www.30080.cc-粤淘彩票是骗局吗| www.641661.com-福利彩票门头图片| www.834810.com-齐鲁福彩三d| www.900068.cc-彩51网网站-| www.971267.com-福彩刮刮卡规则| www.cu05.com-网上彩票靠谱的平台| www.49tq.com-赢彩彩票软件| www.5747.vip-排列五体彩-| www.922833.com-福利彩票可以转让吗| www.996220.com-北京足彩单场| www.em25.com-彩吧网论坛-| www.wf06.com-甘肃快三夸度走势图| www.730025.com-久久彩票有人赢吗| www.860.cm-时时彩在玩输死你| www.10561.com-胜负彩开奖走势图| www.816566.com-七乐彩每周几开奖| www.974824.com-七星彩加急彩版| www.hx21.com-北京快三中奖号| www.z49.org-元代红绿彩-| www.409876.com-米彩手表-| www.529566.com-快手可以直播彩票么| www.670152.com-256玩彩票ios| www.785338.com-七星彩跨度多少| www.910853.com-彩票排列五开奖直播| 易盈彩票www.7793u.com| www.548192.com-七星彩大公鸡规律图| www.784301.com-彩票强强安卓版下载| www.769569.com-好彩投吧-| www.874541.com-山西省福利彩票网站| 百姓彩票www.www.bxcp3333.com| www.vz19.com-人人中彩票还能用吗| www.888763.com-下载最新网易彩票| 中彩网www.61233y.com| www.h28.club-彩票这么看-| www.204400.com-下载内蒙古福利彩票| www.296512.com-江苏e球彩奖金表| www.362008.com-万彩吧官方下载| www.4ys.com-彩乃奈奈百度云图片| www.006353.com-中国体彩网开奖直播| www.500186.com-彩票导航平安| www.585603.com-购买海外彩票| www.660640.com-章鱼彩票合法吗| www.727918.com-易盈彩票官网| www.780565.com-彩铅手绘人物| www.838057.com-手机福彩3d购买| www.891017.com-尊彩app下载| www.944431.com-体育彩票最新骗局| www.993319.com-足彩论坛-| www.cp9800.com-实时快三走势图青海| www.kz73.com-体彩福彩-| www.2946.org-福彩电话投注中奖| www.520757.cc-快三26组合-| www.007878.cc-解密彩票-|