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

知道了
亚洲28 www.886872.com-刷彩金怎么躲风控| www.74853.com-重庆时时彩害了我| www.16ej.com-a彩娱乐登录注册| www.7816.org-彩票碎随机还是人为| www.057774.com-七星彩当天几点开奖| www.409876.com-米彩手表-| www.e08.pw-竞彩大奖2019| www.001829.com-天天彩票软件正规吗| www.165702.com-彩名堂网站-| www.479105.com-扬州公道体彩中奖| www.en61.com-快三如何准确杀一码| www.841.mobi-二月八号彩票双色球| www.130641.com-时时彩怎么分析跨度| www.606096.com-梦见数字买彩票| www.968893.com-刷彩票流水靠谱吗| www.9973.loan-请搜索福利彩票| www.315118.com-福彩跑马幸运彩规则| www.777768.com-百胜彩票app下载| www.mk18.com-十大彩票排名| www.5989.cn-酷彩网快三-| www.555481.com-汇智游戏豹子王彩票| www.9bp.com-美国彩票强力球开奖| www.9183.wang-七乐彩什么时候上市| www.077153.com-青海快三投注| www.8925.biz-熊猫彩票真的假的| www.491396.com-体彩排列5中奖注数| www.440210.com-彩票能用概率学算吗| 幸运彩票www.852699.com| www.021268.com-山东福彩网下载| www.10849.com-易米足彩-| www.48995.com-合肥十一选五爱乐彩| www.8365.cc-下载七星彩小辣椒| www.so57.com-时时彩五星和值大小| www.2146.cn-胜负彩对阵-| www.93736.cc-彩70彩票怎么样| www.646641.com-足彩14场怎么买| 凤凰彩票www.55228c.com| www.238922.com-兼职彩票代打骗局| www.01414.com-彩票精准计划网| www.578122.com-体彩兑奖期限多久| www.in60.com-彩乐乐彩票下载安装| www.65il.com-体彩在哪个台直播| www.28pz.com-7意彩app苹果版| www.6252.biz-彩八苹果下载软件| www.465746.com-大众彩票网址| www.751068.com-福中彩-| www.365174.cc-安徽福彩快3加奖| www.81275.com-排五走势图乐彩网| www.8829.vip-170彩票网图谜| www.034820.com-花生彩票软件是真吗| www.722506.com-彩票128-| www.900440.com-江苏体彩网官方网站| www.082043.com-大发快三有多少平台| www.727033.com-乐彩软件-| www.329332.com-蚂蚁彩票合法吗| www.859665.com-湖北快三跨度和值表| www.s45.in-彩金申请-| www.89400.com-粉毒跟彩毒的区别| www.679601.com-老公爱买彩票怎么办| www.96ng.com-体彩超出限号| www.36962.cc-天天有彩票苹果版| www.085992.com-姜山足彩推荐| www.992904.com-微信彩票赚钱下载| www.123996.com-福彩开心农场| www.064888.com-海南私彩举报电话| www.220950.cc-中彩网快三下载安装| www.365389.cc-福彩6码组三遗漏| www.3397.mobi-皇冠足彩网址| www.423722.com-泰国彩票官网| www.446612.com-福利彩票开机号查询| www.971867.com-头奖彩票官网| www.122705.com-现实中的彩神| www.34vc.com-七星彩中间错了一个| www.7771.pw-关于彩票感想| www.29726.cc-彩票注册即送27元| www.73929.com-福利彩票直播开奖| www.024794.com-景德镇体彩中心| www.098477.com-gc国彩-| www.167864.com-安徽快三一定牛| www.365190.cc-彩票近期中奖号| www.066466.cc-玩彩票大平台怎么样| www.972324.com-福彩3d一定牛下载| www.715281.com-彩神辅助-| www.973231.com-彩虹宝宝歌曲| www.23357.cc-易彩登陆平台| www.by03.com-苏州快三开奖| www.793101.com-彩票九怎么玩才能| www.333248.com-广东快三官网| www.888756.com-黑彩娱乐平台哪个好| www.20505.com-百赢彩票网-| www.358424.com-时时彩搭建教程| www.550058.com-手机能安装彩播吗| www.771016.com-彩虹七号游戏| www.878874.com-彩王争霸app| www.9gs.cc-体彩七位数能买吗| www.4700.vip-新浪爱彩购彩大厅| www.3584.cc-吉林快三助赢计划| www.293177.com-河南帝彩快3| www.853361.com-河口彩客化学泄漏| www.8408.cn-七星彩票手机下载| www.608325.com-中彩网3d走式图| www.886991.com-凤凰彩票的骗局| www.153023.com-够力七星彩奖表官网| www.382879.com-体彩排列玩法| www.927298.com-彩票几位数字构成| www.4995.com-苹果4s彩色膜| www.58755.cc-天天彩票大小| www.892989.com-最好的3d彩票软件| www.608127.com-彩会友app-| www.123706.com-彩票老师骗局| www.788329.com-足彩19039开奖| www.0151.vip-彩色近义词-| www.85521.cc-愛博彩票-| www.227267.com-快三走势图江苏遗漏| www.045447.com-牛彩网汇总图九| www.583787.com-今天福彩3d图片| www.yi5.com-快乐彩票app下载| www.183672.com-中国福彩中心官网| www.830817.com-注册送彩金的棋牌| www.7109.vip-96购彩-| www.57163.cc-快三拉花致青春| www.31068.com-新彩尊登录-| www.931855.com-彩票中1亿交多少税| www.ci57.com-广东体彩快乐十分| www.002344.com-幸运快三代玩微信| www.427098.com-双色球软件彩计划| www.590578.com-买七星彩图片大全| www.732981.com-七星彩开奖全部历史| www.873552.com-网易彩票可以赚钱吗| www.54169.com-重庆时时彩3星遗漏| www.029012.com-体育彩票分几种| www.5708.cn-糯种三彩翡翠价格| www.611825.com-汇佰彩票-| www.648666.com-十选五彩票规则介绍| www.917271.com-彩铅画简单图片| www.508568.com-花画图片大全彩铅画| www.642474.com-彩世界软件下载| www.249868.com-大乐透大彩网下载| www.779777.com-福彩3d讲座视频| www.c44.cm-36o福彩全国开奖| www.89et.com-澳彩鹦鹉-| www.7079.com-汇彩网提现-| www.465065.com-美甲彩绘图片| www.305573.com-买彩票的流程| www.hy22.cc-三d福彩字谜图谜| www.587019.com-利鑫彩票平台代理| www.819762.com-彩票哪里买哪里兑奖| www.0492.top-优选彩店官方| www.854452.com-大发快三骰子下载| www.tk88.cc-公益福彩被骗| www.263720.com-万优彩票-| www.ai6.com-广西快三倍投技巧| www.15565.cc-附近中国体育彩票站| www.0602.org-500彩票有规律吗| www.108271.com-彩票店面-| www.858964.com-福彩75期开奖结果| www.c1.hk-快三湖北今天走势图| www.96462.com-竞彩最高投注金额| www.461677.com-福彩3地开奖直播| www.678864.com-足彩推荐靠谱的软件| www.108696.com-七星彩1开奖| www.862155.com-幸运彩票下载app| www.32ym.com-红旗彩票官方首页| www.106433.com-彩票今晚出什么|