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.hzjiajiaow.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.hzjiajiaow.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.hzjiajiaow.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.329201.com-深圳福彩中心| www.6938.cn-七彩云南是哪七彩| www.783.cn-彩879彩票-| www.117666.com-下载快乐彩票| www.335088.com-上海福彩选四预测| www.451360.com-分分彩做号软件| www.554071.com-晨兴彩票手机版| www.083788.com-买彩票输了-| www.9133.pw-七乐彩历史上的今天| www.01az.com-彩虹山是怎样形成的| www.9039.cm-体彩篮球怎么玩| www.051299.com-购彩通苹果系统| www.96382.cc-福彩业务-| www.090889.com-众彩网下载-| www.686433.com-中彩啦客户端| www.794713.cc-彩票巫师-| www.886202.com-大地彩票下载| www.132855.com-足彩3串1什么意思| www.519365.cc-主角中彩票的小说| www.620298.com-竞彩亚盘怎么玩| www.697848.com-中国全民彩票合法吗| www.825525.com-说彩票视频-| www.336609.com-乐猫彩票安卓版下载| www.414018.com-昆明七彩酒店电话| www.514191.com-彩票国际黑钱平台| www.628930.com-安徽福彩中心网站| www.754176.com-聚福彩票-| www.826989.com-唯彩会专家预测| www.917422.com-必赢版手机彩票| 众发彩票www.658zf.com| www.799036.com-长城彩票官网下载| www.888253.com-机选七星彩号码一注| www.953871.com-铁盒好彩1871| 99彩票www.99340.cc| www.0656.vip-福利彩票都有什么| www.7488.org-上海福彩实体店| www.18288.com-株洲市福彩管理中心| www.64166.cc-老盘任九胜负彩推荐| www.025077.com-福体彩开奖结果公布| www.368131.com-①13彩-| www.150087.com-彩93app-| www.076270.com-彩票是商品吗| www.oh6.com-福彩和夸走势图| www.276716.com-互娱彩票百盈快三| www.823730.com-体彩七星彩怎样兑奖| www.785152.com-海南7星彩155| www.937216.com-最新版五福彩app| www.ms14.com-玩时时彩最稳的玩法| www.90119.com-7彩网官方-| www.523059.com-五百竞彩即时比分| www.59lf.com-2019年竞彩足球| www.307592.com-湖南体彩排三论坛| www.830511.com-看彩票的软件| www.956075.com-天娱彩票是真的假的| www.f24.link-彩票网址大全导航| www.932683.com-分分快三是什么| 福彩天下www.801896.com| www.6284.vip-看彩吧-| www.22732.com-快三输了怎么赢回来| www.63797.cc-快乐彩胆拖对照表| www.031759.com-下彩网登录-| www.8559.in-彩票双色球专家杀号| www.905330.com-竞彩足球计算器玩法| www.325923.com-中国彩宝-| www.413287.com-彩色沥青路面| www.875317.com-澳客网彩票网| www.998540.com-国外快三福利彩票| www.xs21.com-数字彩票出号规律| www.94232.com-买彩票真的会中奖吗| www.ah44.com-熊猫娱乐彩票| www.90ht.com-体彩第19019期| www.5467.vip-彩票开奖试机导3d| www.b74.cn-江西彩票中心厅| www.498324.com-日立彩票怎么注册| www.13872.cc-非凡人工时时彩计划| www.685718.com-好运来3d彩票预测| www.845787.com-于海彩票-| www.3535.mobi-糖果派对超级彩金| www.209232.com-黑彩赌博的案例| www.797723.com-99购十分彩-| www.051326.com-福彩3d跨度表图| www.159857.com-彩票2元网首页首页| www.700533.com-全国联销图彩迷天地| www.817744.com-澳门福彩-| www.sw2.cc-上海体育彩票竞彩店| www.01sl.com-3d太湖字谜新彩网| www.1ak.cc-七乐彩票是非法的吗| www.127712.com-彩虹哥可靠吗| www.135629.com-彩票导航大全| www.293890.com-江苏快三前天开奖| www.480202.com-澳门快三分析软件| www.595937.com-邢台市福彩中心官网| www.q56.xyz-广西体彩在哪兑奖| www.04640.com-彩票新彩吧网| www.015002.com-彩票中奖牛人爆秘诀| www.093638.com-为什么高频彩票调整| www.088.space-3d走势图彩宝贝| www.623453.com-彩6最新版本下载| www.421946.com-极速快三开奖记录| www.316019.com-上海体育彩票地址| www.429517.com-陕西彩旗快3| www.755074.com-赤坎哪里有福利彩票| www.931443.com-中彩票咒语-| www.87hv.com-彩之票-| www.663375.com-下载安徽福彩网| www.819406.com-七星彩彩图版区| www.946767.com-工地彩钢围挡厂家| www.yv5.com-全国快三app| www.345883.cc-金碧汇彩靠谱不靠谱| www.73288.com-福彩群号-| www.ed72.com-体彩36选7-| www.897811.com-体育彩票广告词| www.cu65.com-彩宝app下载| www.yb06.com-所有彩票网上都停售| www.45hp.com-快三投资多少钱| www.511893.com-7彩app骗-| www.698243.com-亚博时时彩-| www.495112.com-足彩通红球球app| www.593590.com-七彩旅游公有链骗局| www.677605.com-重庆彩票11选5| www.778417.com-精彩音乐汇点歌| www.850569.com-家庭成员生日彩票| www.914115.com-159彩票网关停| www.976283.com-河南福彩中心银行| www.ap44.com-云南体彩-| www.793396.com-打彩票赊账-| www.3if.com-快彩王是可靠吗| www.336731.com-上海福利彩票时时彩| www.1pe.com-博乐名游天天彩票| www.32du.com-网上的时时彩靠谱吗| www.633046.com-竞彩篮球胜分差玩法| www.135181.com-最知名的彩票网站| www.54769.com-6188彩票下载| www.092630.com-提亲四彩礼-| www.947282.com-重庆时时彩调整| www.984019.com-官方购彩平台下载| www.gh00.com-彩虹歌词-| www.781415.com-彩票大发快3下载| www.898288.com-梦见七星彩中奖故事| www.984190.com-福彩字谜解太湖字谜| www.ij70.com-3d彩票之家-| www.42rb.com-换外屏原彩显示没了| www.1094.org-为什么足彩老是输钱| www.905945.com-福建福彩地址| www.998580.com-上海体彩大乐透彩票| www.lk31.com-天天中彩软件| www.4485.vip-购彩网2018-| www.48212.com-彩票平台漏洞| www.086829.com-福彩自动售票机加盟| www.046769.com-乐彩直播app| www.537132.com-168手机彩票下载| www.729877.com-共享彩票官方网站| www.895334.com-广东吉利快三是什么| www.8ic.com-重庆时时彩数字规律| www.64cb.com-奥克足彩网-| www.129102.com-福彩3d综合-| www.246552.com-体彩时时彩11选5| www.190722.com-彩票app平台| www.2021.red-聚丰彩票电脑版| www.9834.loan-古建彩绘花纹| www.73315.com-天涯高人能算彩票吗| www.061111.com-广西福彩快3下载| www.367839.com-不喜欢刚力彩芽| www.472578.com-福彩太湖谜语|