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.362244.com-彩虹心情好的说说| www.540760.com-体育彩票四一八| www.774418.com-福利三分彩开奖号码| www.870036.com-快三老板走势图| www.963917.com-卖体彩引流-| 500彩票www.649677.com| www.nf76.com-全民彩票破解方法| www.08vi.com-彩8是真的能赚钱吗| www.89qy.com-老郑足彩推荐| www.3100.biz-体彩数字怎么选| www.9296.biz-分分彩后二玩法技巧| www.73942.com-彩票源码演示站| www.030042.com-鼎丰彩票一购彩大厅| www.117195.com-湖南省体彩中心地址| www.198581.com-真正玩彩票赚钱的人| www.282888.com-彩票单双与九宫图| www.439287.com-体彩大乐透中后三位| www.543279.com-彩尊领奖有节假日吗| www.652022.com-红牛娱乐快三| www.749939.com-富华彩票-| www.836877.com-318彩票是骗子| www.913227.com-彩票大嬴家走势图| www.974209.com-众亿彩票网官方网站| www.pv73.com-彩1平台-| www.80.com-天天中彩票提现微信| www.77iv.com-天天乐彩票免费下载| www.2036.in-幺兰彩-| www.8231.biz-大旺彩票app| www.33150.com-全民彩票是谁的| www.82107.com-968彩票手机版| www.039773.com-恒大彩票官方网站| www.198184.com-今日贵州快三| www.276357.com-分分快三是假的吗| www.381035.com-彩票开奖票开奖| www.509884.com-黑彩彩票-| www.586729.com-幸运快三福气快三| www.663922.com-南宁广西福彩宾馆| www.747674.com-环彩官网-| www.822797.com-体彩电脑网| www.898550.com-彩票辽宁-| www.968874.com-全民快三乐彩| www.vt54.com-乐购彩票平台正规吗| www.18bm.com-合买彩票抄单意思| www.362.win-购彩计划软件手机版| www.4661.vip-老想着中彩票| www.03952.com-辽宁福利彩票中心| www.54251.com-时时彩遗漏冷热统计| www.001037.com-福彩投注平台| www.074068.com-体彩p3一休杀码图| www.146488.com-彩客网一官网| www.303978.com-福彩天地双色球| www.378679.com-好彩堂开奖资料网站| www.520521.com-e球彩总进球数奖项| www.593852.com-竞彩即时比分直| www.670631.com-内蒙古彩票中奖事件| www.753297.com-中华彩吧合法吗| www.874495.com-关注福彩公众号| www.959550.com-小站宝彩票在哪注册| 大奖彩票www.99djcp.com| www.jq08.com-大发快三有人控制的| www.h50.mobi-香港天下彩票资料| www.42vm.com-今晚彩彩票开奖查询| www.688.biz-福彩3d五行技巧| www.4966.vip-中彩网双色球地址| www.05093.com-出款快的彩票app| www.51635.com-山西福彩中心| www.96794.com-湖南假彩票案| www.062424.com-瑞彩祥云app网站| www.230237.com-百盈彩票是骗局吗| www.306798.com-吉祥彩票网页| www.380065.com-彩票js-| www.525198.com-特彩报码-| www.609559.com-分分彩三星计算方法| www.681954.cc-微信代买彩票中奖了| www.761355.com-彩票虚假中奖广告| www.871787.com-亿彩用户登录| www.947638.com-19052期胜负彩| www.998687.com-香港三色和彩开奖| www.kq7.com-快三推荐号码| www.pf52.com-快三是什么赌博| www.00ox.com-雨后彩虹的形成神话| www.73zn.com-无锡中彩集团| www.1581.com-彩票收藏目录| www.9516.xyz-海南私彩为什么火| www.49890.com-时时彩大奖计划| www.93430.com-齐鲁风彩-| www.055385.com-网络江西快三| www.157079.com-竞彩赚钱-| www.240729.com-彩铅画自学-| www.316228.com-东二里的体彩店| www.383728.com-彩世界安卓版下载| www.525107.com-黑桃k时时彩官网| www.606752.com-足彩最晚停售| www.678429.com-吉林快三号码推荐| www.754666.com-王牌彩票购买平台| www.863440.com-彩客网旧版-| www.927635.com-体彩高效订票app| www.976431.com-银川彩礼2018| www.fh81.com-高德彩诈骗-| www.wj31.com-彩神吉林-| www.10oo.com-彩钢瓦防水怎么做| www.78do.com-国家授权正规足彩| www.1368.hk-九万彩票是谁开的| www.9698.wang-体彩金七宝免费下载| www.85085.com-彩票二维码泄露兑奖| www.033631.com-彩票里什么叫屠龙| www.127459.com-好运彩是正规网吗| www.197674.com-河南快三3遗漏| www.264741.com-360彩大厅首页| www.365531.cc-水溶彩铅图片| www.449224.com-卖体育彩票怎么申请| www.539295.com-石家庄彩票店转让| www.641060.cc-体育彩票广告标志| www.726448.com-手机可以购彩吗| www.795708.com-彩牛彩票安卓链接| www.867153.com-福利彩票网购| www.927616.com-快三彩票害人输千万| www.979696.com-好彩一预测彩彩乐| www.eu35.com-彩票助赢计划网页| www.vq14.com-天天快三-| www.09kz.com-幸运分分彩开奖历史| www.74sg.com-福彩大厅开奖结果| www.0942.com-内蒙古快三开奖链接| www.9117.in-彩霸王高手资料区| www.42481.com-易彩网是合法的么| www.83778.cc-福彩票网-| www.028596.com-杏彩-| www.096691.com-千亿彩票代理| www.154654.com-网易彩票怎么赚钱| www.278699.com-彩票256安卓| www.358242.com-在线买足彩竞猜软件| www.436342.com-九州博彩的网址| www.522309.com-刘雪龙黑彩赚了多少| www.585137.com-体彩彩票店内活动| www.654977.com-福彩晚秋和值谜| www.775636.com-赢彩票天下与你同行| www.859646.com-江苏快三跨度表| www.917857.com-互联网售彩试点| www.972134.com-易网竞彩网-| www.cp9722.com-好彩客-| www.ls50.com-体育彩票任五开奖| www.c72.vip-大乐透购彩截止时间| www.22pj.com-app购彩网靠谱吗| www.662.biz-福利彩票3d图片| www.3819.wang-足球竟彩360比分| www.8654.cm-七星彩遗漏数据查询| www.50335.com-七星彩早版彩图专区| www.88049.com-辽宁福彩兑奖中心| www.033084.com-242彩票-| www.098645.com-福彩在线刮刮乐| www.158029.com-彩678不能提现| www.279856.com-胜负彩500w-| www.356782.com-中国红彩票20| www.426366.com-玩足彩输的倾家荡产| www.513446.com-三分钟时时彩规律| www.574113.com-美国数学天才算彩票| www.632889.com-力彩电子-| www.691236.com-易彩国际登录| www.760563.com-好彩36选3开奖号| www.894507.com-福彩快3投注方法| www.954499.com-体彩二维码扫描| www.997403.com-福彩乐透app| www.cp0078.com-快三中奖助手ios| www.jn55.com-七天彩票网在线官网|