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.868442.com-1分快三软件下载| www.cp3022.com-福建福利彩票快3| www.7353.wang-彩虹六号租号| www.531860.com-手绘彩铅唯美花鸟| www.639715.com-天天幸运中彩票| www.737533.com-快三怎么下注| www.839157.com-网易彩票注册| www.932753.com-正规官方时时彩平台| 99彩票www.66730.cc| www.00188.cc-爱投彩票是真的吗| www.004203.com-竞彩网即时比分| www.iy13.com-温州体彩中心地址| www.9wl.com-时时彩微博-| www.89xs.com-彩票教学网-| www.864163.com-手机高手彩票网下载| www.950198.com-乐彩客安卓版| www.cai9022.com七星彩今晚开奖结果| www.lt22.com-彩票刷水兼职套路| www.s59.org-易彩能提现吗| www.650066.com-博彩骗局在国外| www.50zy.com-赛马彩票三中三| www.011910.com-星期五彩票开什么奖| www.42cc.cc-足彩盘口水位看胜负| www.570316.com-福彩开奖结果查开| www.647211.com-足彩过滤技巧| www.717047.com-先学线描还是彩铅| www.807404.com-连云港彩票获奖查询| www.65jf.com-湖南3d彩票论坛| www.528920.com-新浪福彩双色球| www.194613.com-江苏快三胆码技巧| www.280221.com-福彩快乐12玩法| www.356016.com-昆明牛牛彩票网| www.412439.com-绵阳彩钢围挡定做| www.99633.cc-彩码网站大全| www.41425.com-三晋福利彩票双色球| www.695851.com-足彩十四场投注| www.814789.com-福彩快3开奖实况| www.895026.com-彩票可以往投资说吗| www.965696.com-福彩刷人气靠谱吗| www.cv.com-奖聊安徽快三走势图| www.75800.cc-好彩一开奖查询结果| www.225010.com-网投福彩快三| www.318017.com-大发快三走势规律图| www.397377.com-上海快彩11选5| www.519605.com-今晚体彩排列五预测| www.ec77.com-248彩票app-| www.198132.com-吉林市快三开奖结果| www.261268.com-北京时时彩是官方| www.42396.com-吉祥彩票app下载| www.582010.com-悟空彩票是真的吗| www.693968.com-一分钟一期的时时彩| www.9257.online国家彩票培训师| www.253028.com-当彩票打票员好烦| www.427888.com-竞彩足球腰斩后怎么| www.693968.com-一分钟一期的时时彩| www.789256.com-鸿发彩票网正规吗| www.313693.com-分分快三计划和值| www.cm6.cc-河比快三形态走势图| www.oa08.com-河南快三守号计划表| www.5084.net-彩票摇号软件下载| www.072679.com-cp彩票安卓app| www.317888.com-北京福彩pk10| www.393129.com-彩铅画海豚-| www.501922.com-彩票平台彩金套利| www.568497.com-洛阳七彩龙都| www.637078.com-分分彩做号工具| www.633091.com-竞彩篮球怎么投注| www.276811.com-百宝电子彩走势图| www.432155.com-彩票行家网站| www.568932.com-二四六天好彩手机版| www.b82.vip-卖七星彩用什么软件| www.036762.com-武汉休闲快三一拖二| www.465255.com-足彩随机买能赢吗| www.555362.com-彩票计划软件网| www.618410.com-体彩公益宣传美篇| www.676060.com-全国各省彩礼排行榜| www.721325.com-竞彩霸主双色球预测| www.798215.com-易彩集团一首页| www.890496.cc-快三猜大小-| www.958588.com-河北福彩快三推荐号| 天地彩www.33tdc.com| www.af87.com-体育彩票投注官网| www.237043.com-足彩竞彩新浪投注| www.937120.com-福运彩票-| www.379676.com-中国福彩报电子报| www.721553.com-七星彩内部精准码| www.549644.com-欧冠竞彩怎么买| www.373018.com-欢腾彩票害人| www.91328.com-炫彩手机贴膜| www.553643.com-竞彩改期怎么算| www.706783.com-体育彩票几号放假| www.938636.com-足彩必发指数| www.by15.com-芬兰彩票最高奖金| www.922.live-张星彩所有皮肤台词| www.717.red-彩票定非法经营罪| www.7719.pw-304彩票-| www.57sf.cc-体育彩票贵州工资| www.374818.com-246天天妈彩| www.588745.com-彩票大-| www.338250.com-中山体彩店转让| www.135101.com-快三豹子算红的不| www.398223.com-七星彩今年初几开奖| www.85178.cc-大连有福彩机出售| www.687571.com-陕西福彩中心官网| www.089366.com-内蒙快三害死人| www.900016.cc-福利彩票店装修图| www.34511.com-好彩网极速分分彩| www.292336.com-内蒙快三走势一定牛| www.089026.com-休彩超级大乐透| www.136391.com-广西体彩自助投注| www.7902.cm-彩票混沌公式| www.790768.com-内蒙体彩网-| www.786048.com-体彩大赢家-| www.732645.com-江苏体彩兑奖中心| www.947221.com-3地彩票-| www.108932.com-瓶子彩泥手工| www.413896.com-北京福彩3d研究院| www.556350.com-好彩彩票与你同行| www.622906.com-亚洲彩导航-| www.691976.com-八亿彩软件是什么| www.765313.com-时时彩最赚钱的打法| www.833382.cc-手机乐赢彩票网| www.909610.com-玩彩人三胆图谜| www.983240.com-盈彩把钱提得出来不| www.11bu.com-彩钢瓦漏水怎么处理| www.93sm.com-各种彩色背景图片| www.2627.biz-旺彩推荐软件| www.836186.com-手机顺风彩票| www.911006.com-贵阳快三查询结果| www.972426.com-彩铅画五官教程| www.7941.com-彩宝黄玉-| www.7511.cn-附近的福彩销售点| www.8642.vip-中乐彩app-| www.11033.com-竞彩足球158| www.68170.com-大乐透走势新浪爱彩| www.519221.com-乐盈彩票骗局| www.386199.com-代玩彩票账号| www.1615.cm-澳门快三app| www.191339.com-如何分析快三走势图| www.261010.com-江苏快三网址app| www.317022.com-青岛彩票一等奖| www.377892.com-9188彩票ios| www.473108.com-北京杨艺快三教学| www.99956.com-拉菲2彩票-| www.055359.com-中国合法彩票有哪些| www.86110.com-镀锌彩钢-| www.032090.com-足彩跟单技巧| www.132976.com-天天爱彩票提现| www.241877.com-内蒙快三开奖号| www.420369.com-中博彩票怎么样| www.539075.com-时时彩赢多了就封号| www.946828.com-买篮球彩票的软件| www.995952.com-足彩大1-| www.zy51.com-上海福彩领大奖地方| www.41rx.com-够力七星彩奖手机版| www.0296.xyz-彩票站更名-| www.5315.cm-坂田体彩-| www.542053.com-36o彩票一购彩| www.209120.com-天天彩票助手| www.329331.com-福彩30选五走势图| www.445337.com-阿理彩票app| www.199760.com-时时中彩票app| www.91331.cc-欧盟方盒红好彩| www.040255.com-广西彩票未领奖|