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.834.date-湖南福彩彩民论坛| www.069275.com-福利彩票网上能买吗| www.8286.org-南昌彩票一等奖| www.33306.com-彩票派奖什么意思| www.5hk.com-高频彩有规律吗| www.459100.com-任选9场胜负彩玩法| www.507586.com-市福彩中心地址| www.771771.cc-老凤凰时时彩平台| www.619367.com-3d彩票图纸今天的| www.791042.com-注册送彩金的博彩| www.529120.com-贝酷体彩店-| www.73wr.com-三地图迷总汇牛彩网| www.195812.com-彩种大厅下载| www.085532.com-福彩3d交流-| www.0894.cn-大小球博彩app| www.5126.cn-福利彩票史上最大奖| 500彩票网www.393830.com| www.787728.com-万彩吧彩票势图| www.my83.com-吉林快三软件下载| www.60076.com-福体彩票开奖号| www.119551.com-彩票幽默广告语| www.448242.com-中国体彩二维码怎扫| www.505921.com-黑彩属于诈骗| www.875733.com-时时彩牛牛规则介绍| www.06428.com-福彩3d跨7的号码| www.581787.com-金鹿彩票-| www.840666.com-广西体彩程汉荣| www.596671.com-彩控网开奖查询| www.954698.com-掌上彩票官网登录| www.533267.com-昨日快三开奖号码| www.397375.com-惠民乐彩票提现| www.983675.com-福利彩票哪里兑奖| www.319877.com-北京5分彩的平台| www.796042.com-尊彩是什么-| www.321540.com-彩票六加一开奖| www.663698.com-南宁福彩中心地址| www.0846.top-双色球彩票手机端| www.849977.com-飞彩比分体育网| www.828712.com-138彩票软件下载| www.626289.com-九号彩票80767| www.po19.com-竞彩500下载| www.110541.com-彩99平台下载| www.548665.com-香港五分彩有托吗| www.566484.com-幸运彩最新开奖| www.24480.com-彼岸花怎么画彩铅画| www.263620.com-五分赛车彩票软件| www.968735.com-河内五分彩骗局| www.381924.com-彩仙阁计划-| www.914941.com-淘宝网买彩票可靠吗| www.739314.com-成功彩票平台| www.87388.cc-鸿运彩票提现要多久| www.627187.com-关于罗彩的资料| www.21bf.com-山西福利彩票app| www.050708.com-彩票自动售票机加盟| www.35791.cc-快彩是啥-| www.037024.com-kk彩票网-| www.978469.com-中福快三下载安装| www.47072.com-秒速时时彩公式打法| www.117795.com-彩票怎么看才懂| www.315290.com-彩96最新版-| www.cp0998.com-快三彩票网-| www.pb28.com-广西快乐双彩开奖详| www.933833.com-3d智博谈彩-| www.qt70.com-福彩摇号作弊的视频| www.1177.site-彩票店开业素材| www.127640.com-彩虹待刷网-| www.024798.com-双色球彩票规则玩法| www.220460.com-兼职中彩在线靠谱吗| www.82188.com-国外彩票网-| www.122311.com-福彩3d奖金参照表| www.298366.com-更多精彩-| www.551305.com-贵阳快三app| www.ul65.com-乐彩网-首页| www.512608.com-素描彩铅画图片简单| www.39783.com-九彩彩票手机版| www.928036.com-彩色复印价格| www.253184.com-时时彩软件开发| www.902439.com-吉林快三一共多少期| www.585308.com-时时彩杀胆-| www.5356.biz-牛彩彩票合法吗| www.67528.cc-快三组合表图| www.022630.com-体彩开机号和试机号| www.676765.com-河南省商丘彩礼多少| www.22769.cc-4亿彩票下载| www.618810.com-云南福彩兑奖地址| www.773092.com-哪个网站送彩金| www.150260.com-57彩票app-| www.966267.com-广西快三直播| www.49443.com-柬埔寨做彩票犯法吗| www.964154.com-江苏快三彩乐乐遗漏| www.019042.com-福彩刮刮乐青蛙过河| www.517326.com-有名的国外彩票网| www.30dl.com-昨天体彩出什么号了| www.4972.com-无忧网彩票-| www.ej50.com-广西快三开奖诂果| www.44155.com-彩民彩票无法提现| www.rw28.com-快三秒热水器怎么用| www.963502.com-怎么做时时彩平台| www.35685.cc-福彩3d豹子列表| www.199980.com-安微体彩-| www.253814.com-老时时彩开奖时间表| www.666733.com-乐彩网充值中不到账| www.3323.date-彩票规律计算| www.803302.com-河北快三遗漏最大| www.929325.com-公彩开奖结果| www.cai7255.com江西快三一定| www.vf26.com-网络买彩票骗局| www.19255.cc-网易彩票怎样兑奖| www.738638.com-福彩输了很多钱| www.nj70.com-新浪老式竞彩比分| www.88bn.cc-兼职代买时时彩| www.56951.com-苹果机怎么下彩6| www.266762.com-时时彩追遗漏| www.722330.com-福彩六等奖中几个好| www.1795.com-中彩啦可靠吗| www.93009.cc-福利彩票三地红圣手| www.092817.com-查福彩6十1-| www.820508.com-南国七星彩开心论坛| www.nn06.com-墨肯尼足彩博客| www.82wd.com-福彩3d数字三解码| www.6965.me-融彩网多长时间了| www.610765.com-福彩3b开奖码| www.028067.com-广东福彩36好彩三| www.191449.com-吉林快三免费计划| www.143460.com-彩票快3怎么买得中| www.31iz.com-竞彩职业玩家| www.5395.org-最大的私彩网站| www.35622.com-吉祥彩娱乐平台网址| www.453253.com-体彩销量城市排名| www.833780.com-羊城晚报晚晚好彩板| 爱彩乐www.347918.com| www.7ty.com-彩票中奖让爸妈领奖| www.7639.cc-体彩图-| www.57686.cc-红彩网江苏快三| www.348948.com-河北省彩票大奖得主| www.496909.com-海南体彩缩水软件| www.50072.cc-彩票老司机软件下载| www.219336.com-福建体育彩票论坛| www.399983.com-美国纽约州彩票网站| www.mp24.com-玩时时彩输了好惨| www.769.in-时时彩改码诈骗| www.9812.com-彩票数据大全| www.065066.com-一分快三一分规律| www.181982.com-大发快三官方网站| www.308923.com-彩票专家排行| www.440911.com-四川省体彩中心领导| www.752355.com-必发彩票官方网| www.fi09.com-所有的彩票网站大全| www.88fk.com-体彩排列五中奖注数| www.74581.com-彩色沥青做法| www.062285.com-中国彩平台-| www.332765.com-京彩集团软件下载| www.520841.com-体彩中奖喜报| www.2885.site-网上彩票是骗人的吗| www.16776.cc-辽宁省体育彩票中心| www.79916.cc-福彩刮刮乐中金条| www.082644.com-五省快三是哪五个| www.330771.com-重庆时时彩个人平台| www.524434.com-中国125彩票网战| www.772877.com-微信彩票骗局揭秘| 大赢家彩票网www.178211.com| www.pa14.com-高频彩票要调整| www.2685.vip-山西福彩双色球开奖| www.15500.cc-vip8彩票网-|