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.97pd.com-天下彩网-| www.80994.com-秒开彩-| www.661726.com-竞彩交税-| www.808993.com-购彩网手机下载| www.918015.com-统一彩票官网| www.ee42.com-彩票兼职每小时50| www.6014.cc-山东省体彩中心地图| www.009868.com-福利彩票图片| www.8258.com-爱玩彩六点半| www.283573.com-什么彩票六位数| www.358030.com-彩票怎么买的不懂| www.173368.com-一分快三彩票网| www.kb19.com-105彩票苹果版| www.574.vip-75秒时时彩官网| www.8718.me-南国七星彩4十1| www.427169.com-六安市福彩中心地址| www.873570.com-体彩专家杀码| www.368341.com-彩铅画婚纱-| www.0322.com-福州福彩销售点在哪| www.7838.com-足彩可以当职业吗| www.950131.com-时时彩两顺一反原则| www.03eu.com-广西快三有漏洞吗| www.862.biz-快三开奖中心藏宝阁| www.7850.in-足彩亚盘技巧口诀| www.30640.com-3d杀码论坛乐彩网| www.8147.com-中彩网中奖公告| www.909962.com-一入彩界-| www.583101.com-福彩四等奖-| www.668120.com-彩票店上班注意什么| www.759249.com-福彩3d精品杀号| www.838111.cc-彩票双色球查询结果| www.929076.com-即开型彩票坑人| www.991558.com-百宝彩免费账号| www.rt25.com-乐彩网下载ios| www.13390.com-竞彩十四场开奖| www.94187.com-福利彩票包括啥| www.517691.com-我爱彩票网站首页| www.7648.org-彩票图形代表的数字| www.005070.com-返奖率最高的彩票| www.090036.com-彩票代理微信号| www.751306.com-中彩网一用户登录| www.897004.com-彩3彩票官方网站| www.978473.com-中国福彩选号助手| www.um5.cc-彩票开奖全部查询| www.09ij.com-70099彩票网| www.864.club-彩铅画作品简单| www.02015.cc-彩经网走势图表| www.001465.com-新皇冠彩票怎么样| www.234857.com-3d彩吧第一版字谜| www.yo41.com-美女带着买彩票骗局| www.610306.com-福彩3d破解软件| www.286040.com-正彩彩票网站| www.829557.com-彩678首页-| www.948254.com-体彩的玩法-| www.855686.com-福建体彩31选| www.948241.com-体彩的大乐透| 亚投彩票www.ya270.com| www.2572.com-m5彩票登陆网址| www.8758.bid-网络吉林快三走势图| www.05241.cc-燕赵福利彩票排列七| www.cp4266.com-北京快三计划网| www.032319.com-彩票推广网站| www.9953.xyz-竞彩篮球胜分差技巧| www.9129.biz-彩壹万平台下载| www.52092.com-吉林麒麟快三数据| www.007314.com-附近体育彩票店| www.081710.com-彩票独胆怎么求| www.175601.com-下载快三预测软件| www.6279.cn-五福彩票怎么样| www.233463.com-北京福彩pk拾官网| www.338465.com-七乐彩号码专家预测| www.425586.com-杏彩注册-| www.525772.com-体彩大乐透9等奖| www.746126.com-e彩堂可靠吗| www.60re.com-大盘娱乐福彩预测| www.88yy.com-私彩平台有哪些| www.864815.com-手机上如何买福彩| www.pj49.com-河南农村天价彩礼| www.495113.com-重庆高频彩票| www.cai6754.com河北省快三走势图| www.828623.com-彩票9官网-| www.25963.cc-彩虹的配色-| www.97348.com-古建筑戏台彩绘| www.153865.com-中彩国际-| www.825619.com-山西快三54期查询| www.939496.com-买快三的官方平台| www.cs56.com-快三倍率投注方法| www.11xh.com-合肥体彩中奖| www.751229.com-彩票巴巴是正规的吗| www.465357.com-沈阳快三是真的吗| www.9477.org-彩票在线统计器| www.4677.cn-一元彩票网站有哪些| www.js34.cc-王者彩票以什么盈利| www.838596.com-彩色纸箱印刷企业| www.947985.com-四川体育彩票七位数| www.997956.com-乐彩网工具图表下载| www.330187.com-上海快三速查表| www.479701.com-如何看赔率买足彩| www.81173.cc-双数开彩是什么肖| www.397401.com-彩票天下资料大全| www.558645.com-胜负彩任九-| www.879138.com-河南福彩开奖走势图| www.001839.com-清各种釉彩大瓶| www.323975.com-分分彩买和值技巧| www.534434.com-体彩的走势图| www.612636.com-竞彩网易推荐分析| www.691603.com-烟台福利彩票| www.788318.com-彩票8app下载| www.873652.com-西安福彩机子转让| www.937088.com-彩福大厦带学位吗| www.995437.com-易彩娱乐登录| www.cf26.com-最全的彩票网站| www.ua66.com-彩票同位术-| www.136789.cc-开福彩店流程及利润| www.257557.com-快三挂可靠吗| www.339530.com-九鼎彩票下载安装| www.6937.top-七彩云南翡翠| www.nm.com-中国竞彩网官官网| www.007780.cc-澳客彩网-| www.935788.com-彩神平板打印机价格| www.ck66.cc-中国体彩网开奖查询| www.427474.com-河南福彩跑马攻略| www.135590.com-帝国彩票金管家| www.895001.com-帮别人彩票投注| www.954678.cc-七彩票开奖结果今晚| www.my83.com-吉林快三软件下载| www.7vz.cc-企业员工中彩票真假| www.668928.com-国外彩票中奖| www.750700.com-彩票u9-| www.810426.com-18149期胜负彩| www.953947.com-可以自动追号彩票| 中国福利彩票www.08588t.com| www.ry60.com-彩票256旧版本| www.0cm.com-台湾褔星彩平码资料| www.213515.com-福建快三中奖金额| www.004904.com-预计彩票中奖号码| www.100821.com-必中彩票2-| www.791984.com-附近的福彩双色球店| www.926276.com-上饶体彩征召网点| www.83qv.com-5个数的彩票有哪些| www.328889.com-彩票哪个奖最容易得| www.100114.com-快三输了很多怎么办| www.211928.com-正规手机购彩软件| www.296115.com-甘肃快三跨度图| www.366337.com-彩宝计划-| www.446999.com-黑网站和重庆时时彩| www.520674.com-中国彩票论坛| www.317344.com-多年彩民心得| www.3512.biz-福彩七乐彩杀号公式| www.32222.com-各种彩票开奖时间| www.814367.com-邯郸银行彩票案| www.369450.com-福建体彩泉州乐聊天| www.569199.com-彩之家苹果版本| www.137891.com-三d彩票开奖结果| www.969253.com-众彩易购有托吗| www.cp869.com-快三大小技巧规律| www.9480.loan-pk彩票平台安全吗| www.798812.com-时时彩胆码分析工具| www.288023.com-苹果下载中国福彩| www.240666.com-乐米彩票是不是正规| 杏彩www.00840c.com| www.321112.com-彩票开奖七乐彩开奖| www.43012.cc-深圳南油福利彩票| www.192272.com-好彩3奖金-|