QQ客服
當前位置 : 中国福彩快乐十分开奖分布图 > 代碼 > 網頁特效 > 導航菜單 > jQuery芝麻信用官網導航和圖片輪播布局代碼

中国福利彩票3d分布图: VIP商用 jQuery芝麻信用官網導航和圖片輪播布局代碼

jquery.SuperSlide.js制作芝麻信用官網網頁頂部導航菜單和寬屏圖片輪播切換組合布局代碼。一款非常實用大氣的網站頂部導航和圖片布局樣式代碼。
分享到微信朋友圈
X
[聲明]該素材是本站付費買斷的作品代碼,享受著作權?;?,未經允許請勿轉載,否則追究相應的法律責任。

使用方法:

1、head引入css文件

<link rel="stylesheet" type="text/css" href="statics/css/style.css" />

2、head引入js文件

<script src="statics/js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
<script src="statics/js/jquery.SuperSlide.2.1.1.js" type="text/javascript" charset="utf-8"></script>

3、body引入HTML代碼

<div class="m-head">
	<div class="m-head-slider">
		<a href="#"></a>
	</div>
	<div class="m-head-bar">
		<div class="c-wrapper">
			<a href="#">幫助中心</a>
			<a href="#">登錄</a>
			<span>|</span>
			<a href="#">免費入駐</a>
		</div>
	</div>
	<div class="m-head-nav">
		<ul class="c-wrapper">
			<li class="m-head-nav-logo">
				<a href="#"><img src="statics/images/logo.png" alt="LOGO"></a>
			</li>

			<li class="m-head-nav-item  active">
				<a href="#">首頁</a>
			</li>

			<li class="m-head-nav-item  ">
				<a href="#">信用服務</a>
			</li>

			<li class="m-head-nav-item  ">
				<a href="#">行業方案</a>
			</li>

			<li class="m-head-nav-item  ">
				<a href="#">產品中心</a>
			</li>

			<li class="m-head-nav-item  ">
				<a href="#">開發接入</a>
			</li>

			<li class="m-head-nav-item m-head-nav-right ">
				<a href="#">我的商家服務</a>
			</li>

		</ul>
	</div>
</div>
<div class="index-top">
	<div class="m-carousel slideBox">
		<div class="bd">
			<ul class="m-carousel-list">

				<li style="background-image: url(statics/images/slider1.jpeg);">
					<a href="#">
						<h2 class="c-line-clamp m-carousel-title">“信用+”是下一個十年最大的商業紅利</h2>
						<p class="c-line-clamp m-carousel-note">信用驅動的消費升級趨勢</p>
						<p class="m-carousel-btn">了解更多</p>
					</a>
				</li>

				<li style="background-image: url(statics/images/slider2.png);">
					<a href="#">
						<h2 class="c-line-clamp m-carousel-title">芝麻企業信用招募令</h2>
						<p class="c-line-clamp m-carousel-note">共享企業福利 助力小微成長</p>
						<p class="m-carousel-btn">了解更多</p>
					</a>
				</li>

			</ul>
		</div>
		<div class="c-carousel-dot hd"><span class="active"></span><span></span></div>
	</div>
	<div class="index-top-bar">
		<div class="c-wrapper">
			<div class="c-row">
				<div class="c-col16 index-top-news">
					<h6>芝麻新聞</h6>
					<ul class="c-gap-top-small">

						<li class="c-line-clamp">
							<a href="#">· 信用無形資產可“變現”阿里巴巴企業誠信體系引入芝麻信用</a>
						</li>

						<li class="c-line-clamp">
							<a href="#">· 我國381個城市已開通信用免押服務</a>
						</li>

					</ul>
				</div>
				<div class="c-col4 index-top-media">
					<h6>關注我們</h6>
					<div class="c-gap-top-small">
						<i class="c-icon"><div class="index-top-media-qrcode index-top-media-qrcode-alipay">關注支付寶生活號</div></i>
						<i class="c-icon"><div class="index-top-media-qrcode index-top-media-qrcode-wechat">關注公眾號</div></i>
						<i class="c-icon"><div class="index-top-media-qrcode index-top-media-qrcode-weibo">關注微博</div></i>
					</div>
				</div>
				<div class="c-col4 index-top-tel">
					<h6>服務熱線</h6>
					<p class="c-gap-top">
						<a href="#">0571-88158055</a> 轉 2</p>
				</div>
			</div>
		</div>
	</div>
</div>

<script type="text/javascript">
	jQuery(".slideBox").slide({
		mainCell: ".bd ul",
		titCell: ".hd span",
		titOnClassName: "active",
		effect: "left",
		autoPlay: true,
		trigger: "click"
	});
</script>
[聲明]本站素材來自用戶分享,僅限學習交流請勿用于商業用途。如損害你的權益請聯系客服QQ:2447402004給予處理。
舉報×
舉報原因:

相關代碼

二維碼
意見反饋
×
×

注冊

QQ注冊 立即下載 中国福彩快乐十分开奖分布图

簽到成功!

已連續簽到1天,簽到3天將獲得積分VIP1天

知道了