QQ客服
当前位置 : 首页 > 代码 > 网页特效 > 选项卡/滑动门 > jquery新闻资讯动态列表TAB切换代码

原创商用 jquery新闻资讯动态列表TAB切换代码

jquery 电商资讯新闻轮播及新闻动态TAB切换代码布局,jquery实现广告轮播自动滚动以及新闻动态tab切换效果, js css 分离,结构清晰简单,jquery区域均有备注注释,参数均可修改,企业建站常用效果下载即可使用。
分享到微信朋友圈
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/jquery.SuperSlide.2.1.1.js"></script>

3、body引入HTML代码

<div class="information-box">
	<div class="information-con">
		<div class="information-head">
			<h2>电商资讯</h2>
			<p>及时了解国内外电商行业动态</p>
		</div>
		<div class="information-main clearfix">
			<div class="information-main-fl">
				<div class="bd">
					<ul>
						<li>
							<img src="images/banner.jpg" alt="">
							<div class="information-main-back"></div>
							<p class="information-main-text">
								H5建站/商城产品买多年送多年 <a href="javascript:;" class="main-btn">活动详情</a>
							</p>
						</li>
						<li>
							<img src="images/banner.jpg" alt="">
							<div class="information-main-back"></div>
							<p class="information-main-text">
								H5建站/商城产品买多年送多年 <a href="javascript:;" class="main-btn">活动详情</a>
							</p>
						</li>
						<li>
							<img src="images/banner.jpg" alt="">
							<div class="information-main-back"></div>
							<p class="information-main-text">
								H5建站/商城产品买多年送多年 <a href="javascript:;" class="main-btn">活动详情</a>
							</p>
						</li>
					</ul>
				</div>
				<a href="javascript:void(0)" class="prev"></a>
				<a href="javascript:void(0)" class="next"></a>
			</div>
			<div class="information-main-fr">
				<div class="hd clearfix">
					<ul>
						<li class="on">新闻中心</li>
						<li>行业资讯</li>
						<li>电商干货</li>
					</ul>
				</div>
				<div class="bd">
					<ul>
						<li>
							<span>2018-05-23</span>
							<a href="#" title="团队拓展训练,云指团队合力展风采">团队拓展训练,云指团队合力展风采</a>
						</li>
						<li>
							<span>2018-04-16</span>
							<a href="#" title="烈祝贺云指实力当选“广东企业创新500强...">烈祝贺云指实力当选“广东企业创新500强...</a>
						</li>
						<li>
							<span>2018-04-10</span>
							<a href="#" title="专注身边人和事,云指商圈小程序隆重上线">专注身边人和事,云指商圈小程序隆重上线</a>
						</li>
						<li>
							<span>2018-04-10</span>
							<a href="#" title="击餐饮经营难题?云指餐饮小程序打造全新经...">击餐饮经营难题?云指餐饮小程序打造全新经...</a>
						</li>
						<li>
							<span>2018-04-03</span>
							<a href="#" title="云指佛山50公里徒步公益活动">云指佛山50公里徒步公益活动</a>
						</li>
					</ul>
					<ul>
						<li>
							<span>2018-05-23</span>
							<a href="#" title="DS全球数字峰会:.top域名荣获“20...">DS全球数字峰会:.top域名荣获“20...</a>
						</li>
						<li>
							<span>2018-04-16</span>
							<a href="#" title="面告诉您如何为您的创业公司选择一个出色的...">面告诉您如何为您的创业公司选择一个出色的...</a>
						</li>
						<li>
							<span>2018-04-10</span>
							<a href="#" title="使用新的域名尾缀创建有效的品牌微型网站">使用新的域名尾缀创建有效的品牌微型网站</a>
						</li>
						<li>
							<span>2018-04-10</span>
							<a href="#" title="adix 特别篇:有助于商业上取得成功的...">adix 特别篇:有助于商业上取得成功的...</a>
						</li>
						<li>
							<span>2018-04-03</span>
							<a href="#" title="爆!单字符域名c.top被区块链终端启用">爆!单字符域名c.top被区块链终端启用</a>
						</li>
					</ul>
					<ul>
						<li>
							<span>2018-05-23</span>
							<a href="#" title="小程序关键词怎么选好?">小程序关键词怎么选好?</a>
						</li>
						<li>
							<span>2018-04-16</span>
							<a href="#" title="为什么客户要选用云指微信小程序">为什么客户要选用云指微信小程序</a>
						</li>
						<li>
							<span>2018-04-10</span>
							<a href="#" title="做微信分销商城选择哪个分销系统好">做微信分销商城选择哪个分销系统好</a>
						</li>
						<li>
							<span>2018-04-10</span>
							<a href="#" title="为什么要用云指H5响应式网站呢?">为什么要用云指H5响应式网站呢?</a>
						</li>
						<li>
							<span>2018-04-03</span>
							<a href="#" title="微商必看!做好微信分销商城的8个基础">微商必看!做好微信分销商城的8个基础</a>
						</li>
					</ul>
				</div>
				<div class="information-more">
					<a href="#">查看更多</a>
				</div>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript">

	jQuery(".information-main-fl").slide({
		mainCell: ".bd ul",
		effect: "leftLoop",
		autoPlay: true,
		trigger: "click",
		mouseOverStop: false
	});//轮播

	jQuery(".information-main-fr").slide({
		autoPlay: false,
		trigger: "mouseover",
		delayTime: 700,
		pnLoop: false
	})//tab切换

</script>
[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系客服QQ:2447402004给予处理。
举报×
举报原因:

相关代码

二维码
意见反馈
×
×

注册

QQ注册 立即下载 新浪注册 立即下载

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了
时时乐上海开奖结果 www.733.cm-王刚讲故事中彩票| www.eu94.com-8888彩票大骗局| www.862544.com-今晚彩票开奖号| www.972364.com-查体彩开奖号| www.967255.com-彩票讨论群-| www.cp3381.com-河南彩礼-| www.872824.com-遵义彩票中奖双色球| www.990211.com-彩票77正规吗| www.il53.com-山东彩友沙龙论坛| www.61vg.com-中彩网正版下载安装| www.028049.com-娜彩快开平台在哪| www.237018.com-竞彩足球360| www.127161.com-彩铅画人物古风简单| www.202047.com-玩大发快三怎么投注| www.115048.com-体彩大乐透机彩乐乐| www.179106.com-内蒙古快三跨度图| www.vd87.com-彩神通论坛-| www.283992.com-快三缩水软件app| www.27ge.com-查看支付宝彩票中奖| www.747430.com-购彩网gcw-| www.860352.com-5050彩票安卓版| www.930574.com-快三豹子常见口| www.984260.com-牛彩官网登录| www.ts1.com-易彩彩民异地登录| www.rw70.com-中彩网在线-| www.025655.com-陕西福彩网双色球| www.036762.com-武汉休闲快三一拖二| www.198551.com-精彩十分怎么玩法| www.322015.com-福彩八卦图-| www.3233.org-买球彩票软件| www.414318.com-出彩是啥意思| www.4157.cn-王茜华新剧彩虹| www.9948.cm-岳阳彩礼一般多少钱| www.16267.com-比较靠谱的竞彩平台| www.8977.org-福利彩票选好法| www.545507.com-胜负彩比分开奖| www.427275.com-足彩总进球开奖结果| www.578923.com-福彩3d财子杀码图| www.087104.com-最好的彩票销售平台| www.04987.cc-黑圣手彩吧图库| www.019760.com-中国福利彩票店加盟| www.623922.com-快三长龙app| www.527158.com-彩播彩票-| www.9287.cm-乐彩赢属于赌博吗| www.061397.com-胜负彩彩客网| www.741037.com-探探投彩诈骗| www.5182.me-足彩预测推荐号码| www.260699.com-江苏福彩三开奖结果| www.236140.com-河北省福利彩票快3| www.0js.com-手机天天彩票| 188彩票www.51558.com| www.791503.com-京东上能买彩票吗| www.877687.com-美国彩票代购| www.qs19.com-福彩改企-| www.555925.com-云南福彩大乐透开奖| www.657593.com-福建体育彩票31| www.737587.com-有什么购彩平台安全| www.um05.com-内蒙古福彩中心位置| www.89pz.cc-怎么做个博彩| www.3916.vip-南国七星彩加急彩板| www.0638.net-cc彩球网手机网址| www.89341.com-顶级彩票客户端| www.570085.com-七彩虹显卡多少钱| www.694820.com-竞彩篮球投注比例| www.870280.com-押大小是什么彩票| www.vi13.com-福彩10选5骗局| www.580916.com-新浪足彩数据| www.725468.com-体育彩票算赌博嘛| www.860913.com-福利彩票3d直播| www.954960.com-排列三破解彩票漏洞| www.rl9.com-吉林快三半顺啥意思| www.uq55.com-3d乐彩网免费走势| www.11ww.com-搜索彩票网址大全| www.15xs.cc-3抵制天价彩礼3| www.550513.com-曾峰休闲快三教学| www.038676.com-关于彩票的动图表情| www.357709.com-刮彩票的技巧规律| www.543094.cc-河南省快三下载| www.fo72.com-一分快三计算公式| www.d03.com-彩票开奖排三走势图| www.030132.com-下载手机百度彩票| www.164558.com-彩票害人2017| www.042020.com-大乐透江南彩姐专栏| www.406896.com-福彩3d代线走势图| www.1292.vip-内蒙通辽快三查询| www.2594.cc-福利彩票双色球资讯| www.935169.com-优彩网彩票靠谱吗| www.445332.com-专业玩彩票开| www.792197.com-彩票无票兑奖| www.988799.cc-快三买法-| www.xv31.com-335彩票是真的吗| www.694600.com-篮球彩票单关| www.736797.com-上海福彩电话投注| www.661337.com-彩票套利是什么意思| www.623026.com-好彩频道在哪里播| www.697501.com-七星彩哟奖金规则| www.780882.com-中彩网积分有什么用| www.865716.com-彩票分析预测方法| www.932073.com-官方时时彩黑吗| 发彩www.50732k.com| www.51849.com-中大奖彩票图片| www.718521.com-彩虹的含义-| www.4863.net-梦到买彩票-| www.536963.com-中国福利彩票双色珑| www.658322.com-彩神通代理软件下载| www.505314.com-黄家彩票的网址大全| www.916685.com-彩票返点最高的平台| www.398508.com-七星彩开奖时间安排| www.507832.com-浩博时时彩手机网址| www.9167.in-87彩票官网下载| www.31317.cc-麒麟彩票网-| www.206895.com-152彩票计划软件| www.rh46.com-爱彩乐彩票网下载| www.01.cm-彩牛app-| www.cai7799.com甘肃福彩快3走势图| www.953702.com-中国彩是正规的吗| www.uj29.com-福彩≡地-| www.25355.cc-蒙娜丽莎的彩铅画| www.288781.com-全民汇彩票下载| www.521441.com-鑫亿彩-| www.882329.com-078彩票是真的么| 500彩票www.202423.com| www.sy27.cc-够力七星彩安装旧版| www.62uc.com-晋城彩票-| www.4096.vip-珐琅彩瓷器价格| www.791342.com-时时彩助手挑码| www.879002.com-忆彩彩票-| www.956466.com-富贵彩票可信吗| 华人彩票www.454556.com| www.789669.com-易彩快三骰子| www.901211.com-快三买法稳赚不赔| www.964257.com-足球竞彩赛果| www.cp142.com-快彩骗局揭秘| www.387866.com-派彩和返水-| www.602448.com-彩部落钱能提出来吗| www.755289.com-韩国彩票查询双色球| www.912538.com-玩网络彩票警察抓吗| www.s93.cc-在崇左福利彩票中奖| www.512381.com-秋天彩铅画-| www.46rs.com-机打彩票设备| www.5651.wang-大马彩4d今天| www.42018.com-中彩吧平台是真的么| www.181433.com-10分快三计划网站| www.353046.com-彩铅笔手绘图片大全| www.442369.com-彩票站招聘信息| www.523506.com-彩票合买到底靠谱不| www.586174.com-人人中彩票怎么了| www.665267.com-彩票金七乐走势图| www.721325.com-竞彩霸主双色球预测| www.784798.com-七星彩走势图一综合| www.855893.com-七乐彩复式8个号| www.899858.com-22彩票官方app| www.950529.com-e乐彩网-| 大福彩票www.df94.com| www.989916.com-彩票77是真的吗| www.dc52.com-福彩彩宝网开机号| www.cp9868.com-易彩快3计划| www.505163.com-天才彩王大乐透专栏| www.669848.com-体彩有几个数字| www.770788.com-时时彩后一技巧| www.871670.com-足彩310过滤软件| www.943336.com-百胜彩票是什么网址| 网易彩票www.093wy.com| www.875408.com-玩网络彩票一直平投|