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.531811.com-篮彩nba比赛| www.699892.com-沈阳福彩兑奖地址| www.786447.com-彩票概率周期| www.882451.com-河北体彩网官| www.962591.com-星光彩票软件下载| 盈彩www.yc7701.com| www.hr90.com-五百万彩票网电脑版| www.904248.com-快三分解教学口令| www.339534.com-湖北快三和值振幅| www.517952.com-北京乐赢彩票| www.622906.com-亚洲彩导航-| www.750480.com-中福快三软件计划| www.572549.com-亚博体育彩票正规吗| www.182087.com-官网彩票app快3| www.313772.com-关于彩票新闻| www.36647.com-博彩股有哪些| www.009291.com-178彩票邀请码| www.082053.com-玩快三有什么app| www.352730.com-哪个黑彩平台靠谱| www.9030.vip-中国彩票大全| www.4so.cc-刘军玩彩教程| www.19921.cc-香港铂金彩票网址| www.028050.com-女生叫你和她投彩| www.5927.top-大中华彩票系统| www.140408.com-彩票99靠谱吗| www.14nd.com-体彩排列七星彩| www.954971.com-彩票店网上接单| www.954317.com-109彩票app-| www.yb5.com-京彩5分快3-| www.849896.com-竞彩官方是什么意思| 500万彩票www.35155g.com| www.o22.org-彩票技巧大全| www.8928.bid-彩票包赢技术| www.47266.com-体彩销售截止时间| www.97772.cc-宝马团队时时彩计划| www.ed60.com-百信彩票靠谱吗| www.e75.com-今晚七彩奖开奖结果| www.41hk.com-体育彩票1月27号| www.051805.com-万豪彩票助手旧版| www.256900.com-安徽快三预测大小| www.377576.com-彩票店一般几点下班| www.19393.cc-发彩快3计划软件| www.99218.com-时时彩资金投注策略| www.110468.com-青海体彩-| www.228581.com-彩色压印地坪| www.396299.com-体彩星期四有开奖吗| www.553555.cc-彩票包抄法-| www.526993.com-澳洲快三开奖走势图| www.621508.com-福利彩票25选5| www.333757.com-爱彩a22-| www.wk1.com-体育彩票开奖号码| www.737195.com-好彩网论坛首页| www.885106.com-有玩同乐彩票的吗| www.cai3363.com快三投注-| www.46nh.com-二四六天彩开奖结果| www.2113.wang-黄金彩票娱乐| www.8707.top-全民竞彩足球是不是| www.531762.com-彩博客8667-| www.388803.com-彩票走势头-| www.664329.com-网易体育彩票频道| www.65385.com-彩票抽奖软件| www.235777.com-福彩快三专家推荐号| www.2227.vip-彩票微店铺怎么申请| www.84858.com-孤不归福彩专栏| www.jj00.com-福彩3d彩票图片| www.541355.com-济南彩箱厂-| www.730013.com-福彩3d赚钱选号法| www.867827.com-海南体彩论坛社区| www.962915.com-彩色水磨石地面图片| www.bu18.com-福建快三开奖今天| www.s92.shop-快三计算和值公式| www.8896.in-足球竞彩可靠吗| www.110154.com-新乐彩平台-| www.54gv.com-彩票遗漏分析软件| www.8198.net-49彩票开奖网| www.352730.com-哪个黑彩平台靠谱| www.573055.com-时时彩网购-| www.736962.com-上海福彩网点| www.479702.com-7星彩骗局-| www.151357.com-即开型彩票概率分析| www.949884.com-炫乐彩票六年实力| 亿万彩票www.910882.com| www.578121.com-最新彩票报纸大全| www.514955.com-彩妆专卖店-| www.599931.com-买什么彩票的人多| www.198592.com-彩神vii-| www.363876.com-购世界杯彩票| www.666873.com-彩票为什么倍投| www.900512.com-福彩3d牛彩预测| www.36929.cc-彩宝时时彩官方网站| www.028386.com-500彩票是网赌吗| www.2640.vip-福建体彩开奖时间表| www.8417.org-福利彩票中奖神器| www.56533.com-奔腾彩票下载| www.036697.com-下载最多的彩票软件| www.715544.com-新彩票是骗局揭秘| www.881386.com-幸运快三计划交流群| www.338773.com-彩70彩票官网| www.495483.com-高手彩票论坛首页| www.615329.com-体彩几位数才算中奖| www.739393.com-八彩国际童模机构| www.22yb.com-福彩几个月过期| www.593508.com-七彩阳光标准| www.126653.com-印尼时时彩官网| www.83ef.com-喝彩中华蔡正仁| www.00488.com-中国福彩公众号| www.508788.com-我要举报好运彩网站| www.123574.com-天天乐彩输的荡产| www.407005.com-体彩七星彩奇偶| www.05838.com-足彩单场竞猜| www.475677.com-时时彩后四直选单式| www.488288.com-彩琳95-| www.08777.cc-福彩3d10期计划| www.63989.com-澳洲三分彩计划| www.by69.cc-福彩湖北快三走势图| www.89727.com-2019年4月足彩| www.2546.cn-福彩北京快乐8| www.635750.com-时时彩app888| www.15771.cc-公益彩票是骗人的吗| www.545513.com-易彩快三人工预测| www.616980.com-彩神每日预测金胆| www.9593.cn-新浪体彩开奖| www.241411.com-彩神大发快3助手| www.67836.cc-怎么黑进彩票平台| www.986742.com-篮球竞彩比分直插| www.ge20.com-三分快三是真的吗| www.50tx.com-星彩网号码走势图| www.12.org-大马彩在哪查开奖| www.712817.com-鸿鼎彩票登录| www.ry15.com-一分快三开奖网站| www.7733.tv-黑龙江时时彩投注| www.51643.cc-今日竞彩比分推荐| www.3550.biz-老彩83官方下载| www.168490.com-玩快三技巧-| www.26832.cc-七星彩最新开奖号| www.088972.com-速赢彩app-| www.688055.com-app彩票下载大全| www.56.org-彩团网1242cc| www.5099.net-彩票群微信群| www.53411.com-甘肃快三正常规律| www.if12.com-九州博彩官网| www.126335.com-彩票网站违法吗| www.941218.com-中国体育彩票机选网| www.cai9233.com兰州快三一天多少期| www.kj75.cc-易彩快3开奖结果| www.ag91.com-河南体育彩票481| www.585318.com-网易彩票快乐购| www.670502.com-彩经网新版排三| www.01620.com-2017白菜送彩金| www.090856.com-下载买中国体育彩| www.025637.com-网络彩票代理怎么做| www.84kj.com-极速快车彩票的玩法| www.9979.org-今晚七星彩票开结果| www.2932.xyz-时彩万能码-| www.t80.cn-彩票升奖公告查询| www.335460.com-购买彩票app| www.rm86.com-福彩中奖几率| www.15ap.com-福彩3b之家首页| www.987240.com-微信彩票扫码兑奖| www.ex76.com-中福网彩票官网| www.875149.com-分分彩玩到跳楼| www.973349.com-彩虹岛职业-| www.cai7199.com彩票官方计划app| www.rh00.com-今日头条专业玩彩|