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天

知道了
亚洲28 www.624998.com-a4彩票网-| www.377010.com-赢彩与你-| www.703868.cc-什么是私彩-| www.962143.com-彩涂铝卷批发| www.34pn.com-彩运来注册与登陆| www.131389.com-郑州市彩礼一般多少| www.617360.com-长春彩票站出兑| www.721048.com-新2彩票七肖公式| www.876601.com-福彩3d中奖条件| www.960084.com-彩票注册送39| www.cp83.com-内蒙古快三助手下载| www.975014.com-福利彩票走势图| www.zg02.com-网易快三计划| www.151.me-哭着叫彩虹歌| www.960090.com-赠彩金的app| www.37537.cc-六开彩票届六| www.089083.com-台灣彩票-| www.59775.com-手机快乐彩十分钟开| www.111048.com-掌上彩票竞彩加奖| www.5941.com-幸运中福彩软件下载| www.370831.com-新宝娱乐彩票| www.513148.com-体彩大赢家走势图下| www.650200.com-就买一种彩票| www.86379.cc-三彩如何加盟| www.305709.com-买彩票不给钱案例| www.479997.com-彩票奖池-| www.868226.com-快三和值中奖概率| www.999111.cc-汇彩网能赚钱么| www.2827.com-好彩投彩票官网| www.33458.cc-彩奖k3-| www.036695.com-彩票榜平台-| www.129478.com-众彩娱乐平台登录| www.233103.com-新浪足球彩票单关| www.356124.com-微信分分彩计划| www.567772.com-怎么在手机上买体彩| www.02zc.com-彩虹伴奏周杰伦视频| www.826279.com-体彩3开奖-| www.122364.com-qq重庆时时彩群| www.988467.com-国民彩票手机皈| www.ir21.com-1分快三开奖| www.230.in-爱彩乐彩票平台| www.4580.biz-彩票怎么能中大奖| www.087110.com-福彩7乐彩复式| www.221827.com-乐点快三-| www.mc43.com-云南彩票快乐10| www.74ik.com-杏彩时时彩平台网址| www.515283.com-七星彩买的人少| www.33675.com-37彩票是官方网站| www.50480.cc-彩票平台搭建开发| www.767920.com-广西快乐双彩奇偶| www.150450.com-家彩开奖网-| www.025856.com-一分快三计算器| www.862155.com-幸运彩票下载app| www.220418.com-彩运8平是真的吗| www.540532.com-肌肉同志彩漫| www.635598.com-七彩阳光广播体橾| www.790938.com-好彩香烟蓝莓爆珠| www.864771.com-手机彩膜图片| www.939911.com-彩神大发下载| www.1479.pw-精彩中国汇-| www.527158.com-彩播彩票-| www.774575.com-七星彩计算-| www.377074.com-97彩票我的账户| www.177511.com-福利彩8合法吗| www.257944.com-皇都彩票是什么平台| www.402550.com-彩票平台招租| www.777729.com-小财神3d彩票论坛| www.d90.cn-正规网购彩票网站| www.65pz.com-卖体育彩票怎么提成| www.2083.cm-江苏福彩30选7| www.817932.com-足彩19031对战| www.926567.com-五福彩票微信群| 惠民彩票www.hm2255.com| www.tp57.com-推算彩票系统| www.012068.com-陇彩宝app下载| www.106945.com-瑞彩祥云破解程序| www.60293.com-88爱彩官网-| www.jf23.com-福彩官网首页| www.003878.com-盈彩网站首页| www.023950.com-国外彩票-| www.057973.com-福彩3d技巧大全| www.337089.com-湖北快三分布| www.400362.com-福彩3d太湖诗汇总| www.744863.com-陕西体彩兑奖流程| www.0fo.com-天天彩票软件贴吧| www.175328.com-彩票开挂神器| www.893876.com-彩牛彩票客户端| www.711.in-把时时彩当成投资| www.be22.com-五分彩是骗局吗| www.957481.com-248彩票平台| www.709.pw-时时彩奇偶形态技巧| www.4627.vip-彩票买不中-| www.00199.com-8k彩票平台-| www.43420.cc-彩要开奖查询| www.017036.com-厦门彩票店转让| www.576964.com-宁波火炬彩票诈骗| www.297302.com-体彩多乐彩开奖结果| www.602200.com-开福利彩票店流程| www.7808.net-蓝月亮天天好彩| www.92208.com-中国福利彩票好彩2| www.091324.com-重庆时时彩开奖生肖| www.178018.com-吉林快三走势| www.203813.com-5d彩票开奖-| www.724833.com-中彩彩票网页| www.838177.com-105彩票官网平台| www.906225.com-吉林快三庄家骗局| www.967099.com-体彩排列三三等奖| www.au6.com-吉林快三输钱| www.48wp.com-彩票领奖中心| www.77182.cc-微彩吧是合法的吗| www.87735.cc-盛兴彩票改数据| www.947556.com-彩票的概率怎么算| 创世纪彩票www.36787f.com| www.779966.com-福彩3d教学-| www.854596.com-中国258竞彩网| www.930610.com-体彩查中奖号码| www.980740.com-彩票资质-| www.ad3.com-江苏快三计划群| www.342199.com-0567好彩群-| www.467886.com-今日体育彩票中奖号| www.15638.cc-水溶彩铅风景画| www.577537.com-上海快三开奖转盘| www.hq18.com-足球彩票分析| www.271133.com-76c彩-| www.01oo.com-上海天天彩开奖结果| www.336933.com-广西福彩快三手机| www.413529.com-天天好彩生肖号码表| www.514480.com-彩钢安装教程| www.109025.com-百彩网免费料大全| www.380105.com-网易彩票不更新| www.0547.pw-全球彩是什么意思| www.783611.com-d东星时时彩登陆| www.547199.com-锋彩直播最新破解版| www.616069.com-即时开彩即的彩| www.694992.com-怎么下载中彩网购彩| www.314401.com-14胜负彩开奖公告| www.431368.com-凯利方差算足彩概率| www.617113.com-体育彩票顶呱呱规则| www.692605.com-话费积分怎么换彩票| www.789861.com-竞技彩足球计算器| www.876220.com-彩客竞彩彩票ios| www.956433.com-富贵彩是坑人的吗| 大赢家彩票www.590791.com| www.i68.in-彩名堂官网免费下载| www.301911.com-南国彩票论坛坛| www.368307.com-七星彩明月珰下载| www.451561.com-风中彩莲爱你无悔| www.025481.com-吉林快三盘-| www.102300.com-北京快三平台下载| www.187953.com-快三全天计划网页版| www.338923.com-下载6698彩票| www.444040.com-全民足球彩票靠谱吗| www.541604.com-网易彩票排列推荐号| www.616201.com-体彩怎么分成| www.691277.com-河南福彩跑马| www.796484.com-9号彩票登录首页| www.902779.com-大发快三辅助| www.997482.com-快开彩票陕西| www.8tm.cc-中国体育彩票的钱| www.881195.com-彩票网站搭建成本| www.965086.com-彩票过年停售时间| www.iv3.cc-安徽快三预测号码| www.mt11.cc-彩77下载苹果版| www.46006.com-568彩票平台|