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

知道了
彩01彩票 www.277679.com-全国快三彩票| www.8001.xyz-彩虹伞小班-| www.808618.com-彩票分析大师靠谱吗| www.441930.com-体彩退机手续| www.494113.com-买彩票几个数字给钱| www.3616.biz-550彩票网-| www.310206.com-我要看体彩和福彩| www.29583.cc-福彩3d8200-| www.87287.cc-三快uu彩票-| www.370149.com-网易七星彩自选| www.860640.com-南京竞猜快三| www.50966.cc-成都福彩中奖| www.00411.com-任选3中奖规则福彩| www.717098.com-彩铅牌子排行榜| www.807452.com-网上彩票线路检测| www.882232.com-网络彩票计划师| www.tk4.com-江西快三推荐一定牛| www.948751.com-河南体彩玩法种类| www.104.cn-13亿彩票下载安装| www.869659.com-有人推荐买鸿运彩票| www.96606.com-手机彩票挂机软件| www.523.me-时时彩停开怎么回事| www.396023.com-彩博娱乐网址| www.313855.com-吉林快三精准杀码| www.451916.com-乐彩彩票软件下载| www.974283.com-彩虹旗代表什么意思| www.634338.com-时时彩助赢计划在线| www.911021.com-福利彩票奖项几个球| www.zk67.com-快三买和值怎么玩| www.341385.com-彩票欲出几率| www.16100.com-乐和彩票合法吗| www.569085.com-福利彩票报纸大全| www.re10.com-很灵的彩票中奖咒语| www.29eg.com-牛蛙彩下载-| www.715171.com-四季彩平台怎么样| www.504879.com-人生没有彩排演讲| www.105949.com-彩28彩票app| www.006610.com-福彩三d预测总汇| 大赢家彩票平台www.937016.com| www.989927.com-彩漂粉成分-| www.dc09.com-311亿彩票-| www.75xm.com-福彩魔鬼速查图表| www.16ni.com-足彩分析网易推荐| www.16990.cc-可变条码彩票价格| www.3728.biz-七星彩19024| www.516824.com-中国福彩授权的平台| www.36xb.com-天天彩票官方直营网| www.264.biz-七星彩网购-| www.214153.com-江西快三cp-| www.163826.com-彩票买几注好| www.dp98.com-哪个省的快三比较真| www.766364.com-重庆时时彩无法提现| www.66zj.cc-腾讯分分彩游规则| www.75993.cc-7号彩票代理| www.069365.com-褔彩15选5开奖| www.761241.com-四川福彩网官方首页| www.896055.com-吉林快三开乐彩购| www.14pe.com-彩经网彩票工具箱| www.7234.com-彩票中奖上税| www.691665.com-彩乐彩票官方网站| www.877858.com-重生之巨额彩票| www.978880.com-福彩山东一句| www.3gf.com-京彩娱乐地址| www.2006.vip-体彩任3开奖时间| www.28192.com-中国彩票坑人| www.027977.com-河南彩礼多少钱| www.yf0.cc-快三时时计划表| www.wt04.com-排五彩票九宫图| www.926422.com-彩茗堂-| www.092081.com-牛牛彩票网骗局| www.606773.com-鸿运网快三规律破解| www.320242.com-四川体彩金7走势图| www.635521.com-如何注册5k彩票| www.737833.com-购乐彩真的假的| www.822025.com-中文3d彩漫-| www.903161.com-福彩3d网上的购买| www.980264.com-彩票cp12下载| www.cp9767.com-青海福彩快三走势图| www.315119.com-篮彩-| www.6275.shop-预测准的彩票| www.010172.com-玩快三输得倾家荡产| www.498885.com-购彩3怎么注册| www.17rj.com-新浪彩票大厅| www.006468.com-⑥和彩-| www.566594.com-河南福彩新闻| www.39nn.com-彩神i邀请码| www.4993.biz-福彩邀请码去哪里弄| www.975681.com-谈彩礼是谁谈| www.tg10.com-彩3彩票联系客服| www.1008.vip-星期一体彩开什么奖| www.09777.com-657彩票在线| www.576236.com-南京福彩兑奖中心| www.706999.com-买彩票的微信名| www.905169.com-江苏快三跟着群| www.552910.com-金钥匙时时彩计划| www.655245.com-网投时时彩能赚钱吗| www.787365.com-雪园春足彩比分直播| www.901933.com-黑彩先赢后输| www.966440.com-彩经彩票手机下载| 68彩票www.68682m.com| www.883933.com-请黑客攻击私彩平台| www.948714.com-江西快三豹子遗漏| www.991272.com-福彩121网-| www.xj9.com-体彩11选五助手| www.14mw.com-3d字谜、双彩| www.19656.com-中国福彩3d论坛| www.qf93.com-体育彩票26选55| www.210600.com-福彩快三靠谱吗| www.322608.com-彩民网站-| www.08911.com-福彩3论坛手机版| www.63889.com-足彩推荐老鬼看盘| www.668801.com-华人彩票的客服| www.846039.com-足球彩票圈贴吧| www.68548.cc-福彩3d合值尾走势| www.122634.com-河内一分彩-| www.800105.com-体彩大乐透计算器| www.869653.com-鸿发彩票网是黑网吗| www.929218.com-玩彩網-| www.975674.com-河南人上蔡县彩礼| 126彩票网www.975126.com| www.37ki.com-够力七星彩表下载| www.928528.com-福彩3d出号规律| www.995124.com-彩票扫码兑奖| www.nm4.com-五分快三走势图大全| www.wc02.com-体彩七星彩专家预测| www.13me.com-五分⑥和彩香港的吗| www.95uw.com-计算器竞彩足| www.888960.com-七乐彩现场直播开奖| www.276613.com-派彩网吉林快三| www.353407.com-京彩彩票违法| www.778336.com-福彩三d字图迷汇总| www.860562.com-彩民村-| www.922344.com-足彩培训师怎么考| www.978499.com-好彩官网是正规的吗| www.cp9585.com-湖北快三今天开奖| www.su47.com-彩票是怎样的玩法| www.158599.com-乐佳商城彩票网站| www.833669.com-没税标无嘴好彩| www.905217.com-在亿彩彩票上被骗| www.974177.com-福彩都有哪些玩法| 500彩票www.701547.com| www.628183.com-体彩任九奖金| www.876524.com-今日彩票老黄历| www.932023.com-福利彩票提成多少| www.981451.com-彩票返点数啥意思| www.ar22.com-贵州体彩官网| www.ur43.com-下载鸿彩手机app| www.5cl.com-台湾五分彩预测| www.44tn.com-a7娱彩登录-| www.197.xyz-伯乐彩票登录网址| www.611682.com-福彩3d走势彩经网| www.712196.com-e乐彩官方-| www.150779.com-福彩快三诈骗手法| www.024687.com-浙江福彩积分兑换| www.156389.com-三分彩计划软件下载| www.42197.com-金利彩票能赚钱吗| www.773297.com-申航彩票真实吗| www.858443.com-彩票信用玩法安全吗| www.928907.com-发现了七星彩算法| www.981914.com-买大发快三违法吗| www.cai5757.com湖北福利快三走势图| www.262189.com-安微快三预测一定牛| www.x96.me-棋牌彩票的项目代理| www.6429.com-彩经网排列5杀号|