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.anchi01.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.anchi01.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.anchi01.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.812717.com-福彩3d籍秘公式| www.761003.com-秒速时时彩计划两期| www.695156.com-吉林体彩网官方首页| www.947174.com-五分快三计划网页版| www.225012.com-福彩幸运快三邦投| www.393218.com-昨天彩票开奖情況| www.561603.com-中一等奖彩票图片| www.791749.com-时时彩坑人秘密| www.901901.cc-黑彩打工员工什么罪| www.995849.com-苹果竞彩-| www.gc74.com-福建省快三预测| www.681613.com-龙江福彩公益为天| www.j88.pw-彩巴图库55125| www.8139.cm-福彩3d好久开奖| www.625909.com-双色球彩宝贝预测| www.895466.com-网投彩票可靠吗| www.612246.com-福彩3d胆码神算| www.378051.com-江苏竞彩店转让| www.1727.win-彩工网快三早知道| www.320526.com-星彩网彩票工具| www.30pz.com-周五那种彩票开奖| www.801659.com-福彩3d如何定二胆| www.458669.com-最近大彩网怎么了| www.160677.com-乐彩网曲线图| www.gs8.com-五分快三怎样看走势| www.08jm.com-彩票一号平台| www.98ye.com-大发分分快三| www.82766.com-新浪陆慧明足彩微博| www.214536.com-41彩票网首页| www.018558.com-彩票分析软件破解版| www.163794.com-哦百万彩票旧版官网| www.0887.loan-好球彩票官方网站| www.09435.com-98c彩票网登录| www.008183.com-福彩选4开奖结果| www.110593.com-福彩快3推荐号| www.94423.com-体彩竞彩篮球开奖| www.222.cx-三分时时彩是什么| www.72lf.com-手机福彩容错软件| www.4458.cn-分分快三会不会作弊| www.12705.com-周口体彩兑奖中心| www.122851.com-福彩3d复试中奖表| www.409639.com-海南彩票政策| www.594985.com-京东彩票靠谱吗| www.cp7959.com-彩45app-| www.301163.com-彩鸿彩票贴吧| www.656705.com-彩票平台bug破解| www.fc99.com-彩票概率学-| www.ys53.com-长春体彩-| www.18tl.com-微信卖私彩判刑| www.739134.com-竞彩比分赔率| www.527096.com-时时彩黄金分割图解| www.730706.com-如何发展彩票下级| www.5555.red-3b彩票开奖号| www.47663.com-好彩妹口头禅图片| www.076126.com-彩票一彩票-| www.476779.com-财富彩票安全吗| www.2730.net-赢钱彩下载苹果版| www.541751.com-足球彩票-| www.ji4.com-河北快三术语| www.d79.net-123电脑彩票| www.244199.com-彩票快三秒加盟| www.828533.com-英国彩票巨奖| www.7210.cc-乐宝彩票快三| www.008418.com-分分彩平台骗局| www.657783.com-黄金屋368彩票| www.719562.com-中彩吧平台怎么样| www.781461.com-校长福彩预测今天| www.852767.com-比利时分分彩走势图| www.911396.com-怎么观察快三走势| www.969674.com-三d开奖结果l体彩| 大赢家彩票平台www.876928.com| www.748378.com-993彩票软件| www.773678.com-天津时时彩票开奖走| www.268650.com-彩经网3d试机号| www.475789.com-广东快乐彩玩法介绍| www.69204.com-众博彩票网-| www.068009.com-彩票开奖源定制| www.793152.com-v8彩票平台坑人吗| www.64236.com-竞彩外围网-| www.019771.com-彩票推广代理加盟| www.252533.com-买彩票群-| www.365296.cc-六仺彩库宝典图| www.503550.com-万达国际彩票网站| www.621298.com-红旗手机彩票| www.972104.com-手机大众彩票合法吗| www.61bv.com-心脏彩超pg正常值| www.854585.com-赵公明福彩-| www.972115.com-8k彩票贴吧-| www.u40.com-风皇彩票下载| www.94ly.com-500彩票违法么| www.2029.cn-彩虹六号rog战队| www.32sa.com-惠民彩票到底是啥| www.550999.com-能合买的彩票的网站| www.699272.com-天津时时彩官方投注| www.827233.com-彩网网-| www.953873.com-360足彩网-| www.kt4.com-中彩网快3选号助手| www.41rx.com-够力七星彩奖手机版| www.zl.com-彩票兑奖期限| www.184466.com-五百万彩票网| www.261025.com-足彩奖金-| www.388440.com-骰子彩票的技巧| www.035056.com-至尊彩为什么没人管| www.141151.com-老猫看彩3d断组| www.ao57.com-彩票中奖查询器| www.070660.com-彩神ⅴlll-| www.33460.com-彩61是合法的吗| www.88447.com-十四场十四场胜负彩| www.043030.com-体育彩票加盟条件| www.10615.com-310足彩星象| www.089045.com-彩神争霸11app| www.848771.com-彩光嫩肤祛痘印| www.920104.com-苏州枫彩骗局| www.976351.com-49彩票是骗人的吗| www.i19.net-华彩赢家彩票骗局| www.36fx.com-火星5分彩计划软件| www.746292.com-黑龙江体彩十一选5| www.739269.com-众发彩票下载安装| www.813234.com-微信女孩玩彩票| www.9618.cn-国家正规彩票种类| www.134266.com-贵烟好彩香烟价格| www.52652.com-怎样看体彩中奖号码| www.95791.cc-体彩顶呱刮返奖率| www.055198.com-陕西的彩票种类| www.221313.com-手机时时彩软件大全| www.094342.com-3彩家-| www.217164.com-地区快三是官方的吗| www.294294.com-买体彩要身份证吗| www.371013.com-新彩画法-| www.481946.com-悦心亿彩违法| www.571748.com-网络彩票能玩吗| www.652495.com-彩票故事大全| www.746868.com-彩票网站优惠| www.849980.com-时时彩斗牛套利| www.954714.com-博大彩票平台| 盛彩网www.41518x.com| www.858918.com-吉林快三助赢软件| www.76xr.com-双彩怎么猜-| www.160123.cc-快三权威邀请码| www.025083.com-今日福体彩开奖号码| www.108309.com-下载彩视577版本| www.179976.cc-网赌分分快三害死人| www.415300.com-七彩狐泳装-| www.mq27.com-赢彩票登录| www.0bc.cc-足彩推手-| www.66505.cc-体彩金七乐怎么玩| www.016811.com-福彩3d组选胆拖| www.6815.com-66彩票官网-| www.531906.com-八卦九宫图用于彩票| www.638579.com-彩票网111cw| www.803044.com-彩票手机购买| www.882947.com-彩678可以挣钱吗| www.952252.com-500彩票极速赛车| 500彩票网www.511059.com| www.10jg.com-天佑风采彩票| www.52lw.com-丰彩保温隔音板| www.0080.com-今日七星彩开奖| www.883623.com-奔驰彩票网页| www.980248.com-买彩票网站有哪些| www.18569.com-彩票第一狂人| www.89931.cc-999博彩论坛大厅| www.051342.com-首页高频彩吧| www.126555.com-湖北彩票案-| www.206452.com-福彩快乐彩走势图|