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.971737.com-大地彩票官方| www.127064.com-彩铅画动漫人物教程| www.3gu.cc-网上不给买彩票了| www.3871.xyz-七星彩四位-| www.889201.com-神彩网论坛网站| www.91141.com-日免无嘴好彩香烟| www.098955.com-今晚福彩开奖号查询| www.135841.com-有彩票中奖的朋友吗| www.75kq.com-足彩最多能买多少钱| www.4057.biz-600w万彩票-| www.620376.com-河南商丘拓城彩礼| www.798107.com-广州鸣彩公司骗过谁| www.883004.com-玩彩票输光-| www.972534.com-人物彩铅画插图| www.7606.top-新浪爱彩pc版| www.39656.cc-微信中彩-| www.sb94.com-快三限号规则| www.84645.com-吉林神采快三全能版| www.79kn.com-彩乐园官网下载安装| www.352206.cc-黑彩平台总汇| www.527144.com-重庆时时彩三星| www.668487.com-朋友在国外彩票公司| www.756251.com-7星彩直播开奖结果| www.835776.com-国内彩票大奖排行| www.909226.com-宝马彩票网-| www.974098.com-彩票之家正版资料| www.cai6667.com吉林省体彩网| www.jw81.com-彩虹周杰伦歌词| www.584647.com-易购彩票是真的吗| www.085996.com-那个彩票平台反水高| www.887313.com-福利彩票是不是骗局| 818合彩www.www.9889hc.com| www.id36.com-网上彩票快速挣钱| www.183232.com-皇都彩票客服| www.536111.com-山东体彩网软件| www.637073.com-翼龙无人机和彩虹4| www.887680.com-阿里巴巴彩票合法吗| www.960408.com-风之彩彩票app| 尊彩www.756764.com| www.45516.com-微彩被骗怎么追回| www.46343.com-新加坡4d彩票| www.146736.com-彩富天下网香港大全| www.798882.cc-彩8彩票骗局| www.925400.com-体彩胆码家彩网| 500彩票www.50054m.com| www.272856.com-福彩销售额-| www.362104.com-描写彩虹品质的诗句| www.459155.com-体彩足球竞彩推荐| www.562979.com-休彩票列三-| www.11752.com-买3d彩票害死人| www.59323.cc-彩票双色球出球顺序| www.3834.biz-dd彩票下载安装| www.781012.com-赢彩彩票246| www.159.win-彩虹的民间别称| www.323279.com-nba篮球彩票预测| www.404141.com-金彩子-| www.520142.com-美国人买彩票方法| www.307155.com-韩国有哪些彩票| www.387321.com-必赢彩票手机客户端| www.500655.com-彩票包赢不赔计划| www.564609.com-1号彩票网站首页| www.531650.com-彩票33网站网页版| www.027934.com-678彩票网站| www.117878.cc-时时彩技巧出号规律| www.196231.com-全国彩票开奖公告| www.429342.com-大中华彩票彩种| www.527100.com-博盈福彩是不是骗局| www.594284.com-香港好彩免费资料大| www.678147.com-福彩购买app| www.654583.com-排列五属于什么彩票| www.718220.com-体育彩票在线直播| www.793053.com-绵阳福彩管理中心| www.860145.com-时时彩票是合法的吗| www.915618.com-福彩网点申请和利润| www.969809.com-彩票线路导航中心| 开心彩票www.363067.com| www.662603.com-旺彩双色球大乐透| www.8770.vip-七星彩大公鸡梦册| www.274615.com-玩快三为什么会输钱| www.413889.com-足彩复式最大| www.526544.com-时时彩后三必中5胆| www.673448.com-彩票开奖结果杏询| www.590135.com-七星彩号码查询中奖| www.566378.com-彩虹6号加速器节点| www.464529.com-辽宁营口快三| www.93321.cc-海南七星彩今晚预测| www.132141.com-郓城彩礼新规定| www.327597.com-赢家彩票app| www.529175.com-新浪彩票双色球竟技| www.709867.com-彩神lll网站| www.789987.com-江苏快三雄鹿计划| www.871388.com-最高倍率彩票| www.942938.com-南宁福彩-| www.985283.com-福彩三d赵公明| www.qr5.cc-体彩我-| www.062891.com-竞彩258彩票官网| www.796463.com-微信美女聊天买彩票| www.886583.cc-彩61下载网址| www.de40.com-达人彩票是真是假| www.b94.top-中国福彩3d金码| www.56qh.com-中国福利彩票站加盟| www.tf07.com-彩票店都倒闭了| www.369230.com-3旳乐彩网-| www.500019.cc-云彩彩票店app| www.130625.com-洛阳彩礼-| www.9644.xyz-福彩双色球几号停售| www.87368.com-933彩票ios-| www.34536.cc-激励买彩票的句子| www.7189.xyz-七彩印象香烟价格| www.34263.com-中国体彩网5| www.76650.com-各种彩票获奖介绍| www.1338.xyz-全部天天彩票下载| 九州彩票www.6769q.com| www.776793.com-一分钟时时彩平台| www.896058.com-武威快三-| www.985605.com-竞彩足球单场分析| www.ip23.com-500网彩票首页| www.1869.website易记彩票网站| www.27691.cc-双彩店门头-| www.82592.com-足彩澳门即时盘比分| www.404668.com-彩铅画用什么纸| www.308309.com-一分快三倍投技巧| www.625280.com-福彩广播-| www.707308.com-彩票漏洞稳赚钱| www.788205.com-足彩分析推荐app| www.860969.com-山东体育彩票在线| www.915376.com-三分彩全天计划| www.969524.com-快三2同号技巧| 发彩www.50732d.com| www.ea17.com-福彩快三最简单玩法| www.091998.com-体彩手游彩官方网站| www.999050.com-天天福彩彩-| www.89pu.com-数字彩算法-| www.77570.com-国家体彩总局网站| www.668922.com-体彩牛彩网图谜总汇| www.110989.com-杏彩168-| www.198795.com-体彩输的倾家荡产| www.932763.com-神圣彩票网址多少| www.78612.cc-新昌双彩农家乐| www.128759.com-36o彩票快三| www.234463.com-代买彩票中奖钱归谁| www.360176.com-一号彩票网app| www.459066.com-6xccc喜彩网| www.5219.wang-注册送300元彩金| www.757053.com-买高频彩能赢钱么| www.645899.com-足球彩技巧-| www.sq51.com-彩民之家正版彩图| www.883.cm-时时彩计划交流群q| www.9888.hk-2019竞彩新规定| www.4665.org-微信怎么买福彩| www.97aq.com-竞彩体育-| www.675719.com-彩票驿站主页| www.37939.com-辽宁福彩怎么样| www.209074.com-私彩平台出租| www.620041.com-如何购买国外的彩票| www.53509.com-福彩快3赌博| www.022406.com-彩票梯子游戏注册| www.080363.com-体彩六加一规则| www.265798.com-e球彩玩法介绍| www.35565.cc-快三红号有多少| www.874377.com-今福彩3d开奖| www.75yz.com-经典彩票-| www.607234.com-时时彩下载安装| www.711479.com-福彩3d独胆推荐|