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.689946.com-腾讯5分彩免费计划| www.6ix.cc-彩票中奖高手| www.436969.com-怀化体育彩票| www.456047.com-红菜苔彩票正规吗| www.587654.cc-彩132app平台| www.663913.com-大庄家计划彩票平台| www.762760.com-qq分分彩正规吗| www.800058.cc-福建体彩微博| www.910661.com-甘肃快三走势带| www.983484.com-福建体彩管方网站| www.hu71.com-七星彩808彩票网| www.f36.net-国乐彩-| www.sd42.com-时时彩走势分析软件| www.30209.com-福彩门户新书签| www.572152.com-福彩3d字谜双彩论| www.43562.com-福彩一周开几次| www.hx78.com-快三技巧对子玩法| www.7816.xyz-职业彩民年收入| www.12wt.com-app809彩票-| www.268057.com-今天湖北快三走势图| www.688566.com-彩上海体育彩票转让| www.59ii.com-四川省体彩中心领导| www.96907.com-福彩群英会计划软件| www.561119.com-中国千亿彩票| www.3447.xyz-排列三彩票-| www.634897.com-建盏养七彩过程| www.317533.com-竞彩经历-| www.gz35.com-上海体彩中心| www.562677.com-网彩跟群计划倍投表| www.493006.com-南京众彩市场搬迁| www.9yr.com-彩票几点不能买| www.237134.com-官方彩票软件下载| www.393344.com-彩铅画人物卡通图片| www.535035.com-梯子游戏彩票| www.634414.com-注册47彩票-| www.737276.com-众彩网子墨预测| www.883896.com-内蒙古快三摇奖现场| www.955139.com-彩票平台怎么找漏洞| 大赢家彩票平台www.263520.com| www.483.pw-快三组合号有哪些| www.168686.com-大发快三屠龙是什么| www.262215.com-福彩快三胆拖买法| www.380394.com-彩票撕烂还能兑奖吗| www.108352.com-总是买彩票什么心态| www.054985.com-研究彩票的成语| www.133683.com-c彩票开奖查询| www.342321.com-天彩粮陕食尚| www.500715.com-一寸彩照是那种| www.416.xyz-256彩票苹果| www.909556.com-江苏快三购彩网网站| www.981501.com-黑客入侵彩票网站| www.ed15.com-彩票兼职-| www.b67.club-人人购福彩-| www.163437.com-福彩双色球篮球推荐| www.251270.com-今日彩是不是真的| www.95wh.com-福彩3d中奖技术| www.912386.com-竞彩附近体彩店| www.cp664.com-下载江苏快三app| www.191670.com-湖北福彩快三奖金| www.2610.top-乐购彩怎么玩| www.31815.cc-梦想彩票网是真的吗| www.98745.com-快开彩票怎么玩法| www.300118.com-中国足球彩票官网| www.668080.com-福建彩票下载安装| www.763223.com-福建体彩官网首页| www.4253.biz-36选7好彩1开奖| www.696636.com-快三平台论坛| www.819406.com-七星彩彩图版区| www.923533.com-cp12彩票app| www.984208.com-3d图吧彩吧第一版| www.zr3.com-浙江快乐彩胆拖| www.s55.net-我介绍朋友玩时时彩| www.1739.win-鸿发彩票网-| www.746228.com-举报网络售彩| www.853206.com-金富彩票可靠吗| www.964971.com-彩票线报-| 500彩票www.50054a.com| www.gz33.cc-518彩票app-| www.ye59.com-快三和值大单的组合| www.23ku.com-快彩123下载| www.94js.com-易彩云官网-| www.686964.com-星彩网官网下载| www.770846.com-福利彩世界官网| www.272778.com-快三号码表图片| www.44779.cc-高盛彩票登陆| www.88646.com-彩9安卓下载| www.476455.com-怎么查彩票黑平台| www.570738.com-3cp上彩票app| www.571829.com-福彩3d试机号体彩| www.68986.cc-鸿运彩票注册地址| www.1sh.cc-杏彩客户端手机版| www.74od.com-天天好彩免费大全| www.1113.pw-竞彩腰斩比赛怎么算| www.8655.date-民政局福彩贪污| www.33674.cc-五百万彩网-| www.78031.com-竞彩单场奖金| www.678137.com-中国体彩营业时间| www.5018.biz-去年七星彩开奖号码| www.3877.cm-竞彩足球场次| www.22653.cc-彩票店最晚几点关门| www.69746.com-吉林快三全能下载| www.397100.com-v8彩票能提款吗| www.221991.com-百彩网网址-| www.303522.com-福彩3d图谜汇总| www.722663.com-玩彩票能赚钱吗| www.931941.com-华彩快3-| www.el01.com-中国彩吧更彩民| www.35om.com-重庆时时彩开奖调整| www.875432.com-有一分钟开的彩票吗| www.35272.com-七星彩小说番外| www.657184.com-福彩3d太湖走势图| www.874946.com-天天竞彩彩票| www.uh5.cc-百宝彩北京快三| www.c44.online-福彩图迷汇总| www.121610.com-百合娱乐玛雅彩票| www.653722.com-澳门赌彩官方网站| www.11968.cc-足球竞彩完场比分| www.sw04.com-中国福彩积分网| www.02qo.com-微信彩票金豆领取| www.981964.com-最近彩票新闻| www.bn21.com-吉林快三图标| www.vx20.com-贵州遵义福彩中心| www.32jw.com-印度三合乐透彩资料| www.307.org-足彩跟单计划| www.820.cc-360彩票智能杀号| www.5689.cx-数字3彩票-| www.07570.cc-500彩票计划导师| www.eb67.com-百姓网彩票-| www.sc86.com-福彩3d和值字谜| www.8jb.com-足彩六场半全场| www.53ht.com-88在线彩票平台| www.072.net-福彩云彩宝-| www.2025.pro-河南福彩下载安装| www.8979.cc-杳彩票开奖公告| www.39287.com-彩票代理app下载| www.dd44.cc-108彩票app-| www.243342.com-彩票是真的吗| www.cai8818.com快3彩票玩法介绍| www.e35.win-香港乐和彩158| www.171050.com-玩彩票一天赚一两千| www.866281.com-搜狐体彩预测| www.947914.com-福利彩票代打兼职| www.997077.com-福彩图迷字迷猜数字| www.ft20.com-手机怎么投注彩票| www.i80.mobi-江苏快三代振幅走势| www.51sl.com-时时彩视频开奖下载| www.934.cn-体彩7星彩按顺序吗| www.5224.cn-如何申请福彩销售点| www.07247.com-广西彩票中奖| www.86350.com-七星彩买奖网址| 乐盈彩票www.lycp883.com| www.181433.com-10分快三计划网站| www.x10.org-彩神5分快3赚钱吗| www.36780.com-体彩电视台开奖时间| www.120208.com-足彩即时比分新浪| www.225658.cc-五星彩app-| www.326106.com-体彩试机号彩宝网| www.740833.com-幸运28彩票网站| www.952461.com-k彩网-| www.861.online-时时彩万能四码| www.zw2.com-河南快三彩票平台| www.17520.com-合肥体育彩票加盟店| www.369164.com-尼彩手机拆解| www.507982.com-七色彩虹打一成语|