QQ客服
当前位置 : 首页 > 代码 > 网页特效 > 导航菜单 > jquery实现顶部固定导航下拉菜单代码

原创商用 jquery实现顶部固定导航下拉菜单代码

jquery 实现二级导航以及导航浮动特效,二级下拉菜单,以及页面滚动导航浮动顶部。电话号码属于特殊字体,如需要 必须单独引入字体,不需要删除即可。jquery superslide开发,均有备注,参数可修改,下载即可使用。
分享到微信朋友圈
X
[声明]该素材是本站付费买断的作品代码,享受著作权保护,未经允许请勿转载,否则追究相应的法律责任。

使用方法:

1、head引入css文件

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

2、head引入js文件

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.SuperSlide.2.1.1.js"></script>

3、body引入HTML代码

<div class="subMenu ui-header">
	<div class="ui-header-box">
		<a href="index.html" class="ui-header-logo">
			<img src="images/logo.png" alt="">
		</a>
		<div class="ui-header-tel">
			<a href="javascript:;">400-660-xxxx</a>
		</div>
		<div class="ui-header-qq">
			<a href="#">QQ咨询</a>
		</div>
		<div class="ui-header-nav">
			<dl>
				<dd class="on">
					<h3>首页</h3>
				</dd>
				<dd>
					<h3>网站建设</h3>
					<ul>
						<li>
							<a href="#">经典型网站</a>
						</li>
						<li>
							<a href="#">营销型网站</a>
						</li>
						<li>
							<a href="#">电商型网站</a>
						</li>
						<li>
							<a href="#">外贸型网站</a>
						</li>
						<li>
							<a href="#">响应式网站</a>
						</li>
					</ul>
				</dd>
				<dd>
					<h3>建站报价</h3>
				</dd>
				<dd>
					<h3>客户案例</h3>
				</dd>
				<dd>
					<h3>全国网点</h3>
				</dd>
				<dd>
					<h3>关于我们</h3>
					<ul style="top:75px;">
						<li>
							<a href="#">关于我们</a>
						</li>
						<li>
							<a href="#">企业文化</a>
						</li>
						<li>
							<a href="#">发展历程</a>
						</li>
					</ul>
				</dd>
			</dl>
		</div>
	</div>
</div>
<div class="banner-bg"></div> <!-- 蓝色背景图  可删除   -->
<div style="height:1000px;"></div>

<script type="text/javascript">
	
	jQuery(".ui-header-nav").slide({
		type: "menu",
		titCell: "dd",
		targetCell: "ul",
		delayTime: 0,
		defaultPlay: false,
		returnDefault: true
	});

	$(document).ready( function() {

		$('.subMenu').smint({

			'scrollSpeed' : 1000

		});

	});

	(function() {
			$.fn.smint = function(options) {
				$(this).addClass('ui-header')
				var settings = $.extend({
					'scrollSpeed ': 500
				}, options);
				return $('.ui-header a').each(function() {
					if (settings.scrollSpeed) {
						var scrollSpeed = settings.scrollSpeed
					}
					var stickyTop = $('.ui-header').offset().top;
					var stickyMenu = function() {
						var scrollTop = $(window).scrollTop();
						if (scrollTop > stickyTop) {
							$('.ui-header').css({
								'position': 'fixed',
								'top': 0
							}).addClass('fixed');
						} else {
							$('.ui-header').css({
								'position': 'absolute',
								'top': stickyTop
							}).removeClass('fixed');
						}
					};
					stickyMenu();
					$(window).scroll(function() {
						stickyMenu();
					});
					$(this).on('click', function(e) {
						var selectorHeight = $('.ui-header').height();
						e.preventDefault();
						var id = $(this).attr('id');
						var goTo = $('div.' + id).offset().top - selectorHeight;
						$("html, body").animate({
							scrollTop: goTo
						}, scrollSpeed);
					});
				});
			}
		}
	)();

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

相关代码

二维码
意见反馈
×
×

注册

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

签到成功!

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

知道了
时时乐上海开奖结果 www.370368.com-彩票网直播间| www.711274.com-网易足彩分析预测| www.972943.com-大发快三是否正规| www.8299.org-聚宝盆时时彩安卓版| www.536683.com-今日七星彩开浆结果| www.928138.com-普通彩打印机| 七天彩www.00665a.com| www.9529.org-百博七星彩投注网| www.266266.com-河北省体育彩票官网| www.501308.com-易彩堂公司地址| www.643467.com-一定牛广西福彩3d| www.657866.com-49彩票手机安卓版| www.581308.com-下载看彩啦-| www.505233.com-博友彩报警管用不| www.687652.com-九州彩票正规网站| www.803030.com-如何在手机上买福彩| www.910508.com-彩票中奖机-| www.975786.com-云购彩票下载安装| www.s22.cc-吉林95诚信快三| www.1215.tv-坤彩科技-| www.01516.com-高飞彩云网配方下载| www.71396.com-彩票开奖查询及预测| www.056966.com-七星彩怎么才算中奖| www.181205.com-内蒙快三走试图| www.277442.com-七星彩19035期| www.507653.com-福彩又-| www.610276.com-在淘宝怎么买彩票| www.721226.com-福彩开奖号马| www.797899.com-彩票源码分享| www.871703.com-苏州福彩中心在哪里| 六福彩票www.66ffi.com| www.56764.com-彩票app可信吗| www.803660.com-双色牛彩藏机图| www.912171.com-体彩不准用87| www.980867.com-福彩店怎么盈利| www.13228.cc-常州彩票得主| www.033537.com-彩神软件下载安装| www.221602.com-彩票号码怎么选| www.357587.com-合伙买彩票的协议| www.92625.cc-时时彩计划骗局| www.610980.com-今日足彩竞猜结果| www.331044.com-彩神争霸-| www.636569.com-彩虹六号大神的键位| www.815991.com-乐彩网图表-| www.979608.com-七天彩票是正规的吗| www.d09.biz-好运来时时彩网站| www.0393.xyz-7彩票官方网| www.2638.org-时时彩票app苹果| www.392207.com-sohu彩票-| www.958124.com-福彩3d未出号码| www.94442.cc-pc彩票app下载| www.992158.com-360竞彩篮球| www.059006.com-快三下期和值的公式| www.135484.com-快3彩票大全| www.316916.com-166网上售彩票| www.50855.com-幸运天天中福彩| www.048108.com-东北彩王马洪平视频| www.170742.com-吉林省长春快三开奖| www.286141.com-中国体彩开奖号码| www.116708.com-福利彩票可以加倍吗| www.235568.com-彩29app苹果版| www.85389.cc-5oo彩票下载| www.528077.com-时时彩猜数字怎么猜| www.702210.com-七星彩中两个数| www.976000.com-三动三不动彩礼| www.zt49.cc-时彩怎么容易赚钱| www.303776.com-鑫彩彩票平台| www.518964.com-腾讯分分彩游戏下载| www.777488.com-澳客彩app下载| www.983900.com-成都彩票兑奖中心| www.44oq.com-博彩公司网站| www.3661.xyz-彩色复印机那款好| www.48495.com-范德彪竞彩猫| www.055121.com-彩票号码几位数| www.196115.com-常州老快三爱彩乐| www.322966.com-易彩网彩票走势图| www.458887.com-福利彩票3d组选| www.591761.com-今日福彩三地独胆| www.748211.com-大富豪彩票预测| www.fi33.com-云顶娱乐彩票注册| www.c94.net-中彩乐群英会app| www.769678.com-好彩店足彩-| www.853876.com-时时彩做庄会赢钱吗| www.927089.com-哪种彩票最好| www.997121.com-爱彩乐是做什么的| www.bk48.com-利彩快三-| www.mj88.com-好彩123-| www.79fn.com-彩票性缘35-| www.226817.com-彩虹世界-| www.333885.com-体彩一共几个数字| www.639261.com-上海福彩查询| www.71ee.com-118彩票网址| www.698945.com-3d中彩网开奖结果| www.876321.com-环球彩票app下载| www.952214.com-加拿大3分彩平台| www.999492.com-彩票课程-| www.sc7.com-代打快三赚佣金| www.rs42.com-彩票计划包赔| www.nv30.com-至尊快三能赚钱吗| www.37.me-好彩246论坛| www.887499.com-釉下彩鉴别-| www.591877.com-977彩票怎么举报| www.721848.com-百万彩票app苹果| www.808744.com-博众重庆时时彩软件| www.889795.com-彩票术语图解大全| www.971338.com-双色球彩票中奖| www.cp799.com-福彩快三大全下载| www.221811.com-快3彩票开挂软件| www.233498.com-湖北快三两同号遗漏| www.789571.com-竞彩001特点| www.905486.com-安徽快三手机app| www.990391.com-978彩票官方网站| www.ha37.com-北京快三是真的吗| www.409377.com-七星乐彩票倍投规律| www.103797.com-竞彩足球310| www.182052.com-快3彩票玩法| www.003391.com-5分钟快三结果| www.dz29.com-彩票平台推广话术| www.09133.com-鸿彩快三彩票网登陆| www.53396.cc-朋友玩时时彩发财了| www.939161.com-xy77彩票app| 688彩票www.688dl.com| www.cb74.com-玩儿快三能挣钱吗| www.1760.cm-福彩网324-| www.191013.com-安徽快三为啥会提前| www.34772.com-牛彩3d字迷论坛| www.010902.com-艾彩论坛-| www.062292.com-3d彩之网相年富| www.509750.com-博彩接口怎么接入| www.639834.com-东方集团彩票游戏| www.728660.com-天降星之书3d彩漫| www.792565.com-民政部彩票中心冯| www.851979.com-买足彩哪个网站好| www.911396.com-怎么观察快三走势| www.965342.com-uu购彩无法提现| 500彩票网www.511039.com| www.4851.cn-山西彩票中奖| www.296684.com-江苏e球彩玩法规则| www.377786.com-河南拿彩礼没嫁妆| www.470278.com-足彩领奖须知| www.538912.com-竞彩足球怎么打票| www.602866.com-彩乐汇平台靠谱吗| www.678938.com-注册免费送彩金网址| www.755792.com-体彩6十1选号技巧| www.867995.com-快三软件安卓版下载| www.937645.com-3d福彩走势图连线| www.991965.com-宜昌市体彩兑奖地址| www.tx99.cc-足彩8串1技巧| www.fw89.com-时时彩正规网站| www.d08.com-彩票开奖结果排列五| www.9343.cm-彩球游戏赚钱| www.783.red-微彩店是什么意思| www.3911.org-七星彩高手论坛图版| www.i24.org-排列五开奖七星彩票| www.816.cx-彩票延时开奖| www.164144.com-竞彩串关投注金额表| www.6217.top-福利彩票4928期| www.33544.com-古代彩票公式| www.33932.cc-高频彩票分析师招聘| www.009164.com-福体彩藏机图谜字谜| www.697.cc-怎么查询足彩受注量| www.aw78.com-福彩5d是每天开| www.635277.com-彩宝品牌排行榜| www.yu98.com-山东省体彩兑奖流程|