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.172982.com-福彩精彩十分走势| www.09540.com-105官网彩票| www.335957.com-买体彩法-| 亿万彩票www.910882.com| www.133666.cc-好彩高手论-| www.380987.com-什么的彩虹桥| www.203159.com-彩票走势怎么看规律| www.431368.com-凯利方差算足彩概率| www.1673.wang-七乐彩助手-| www.ol42.com-海南七星彩玩法技巧| www.422356.com-88爱彩有没有破解| www.903371.com-九万彩票安卓版| www.991387.com-海南私彩头尾| www.an96.com-苏州福利彩票双色球| www.xe53.com-七星彩图片-| www.427599.com-鲸彩漆怎么样| www.607865.com-七乐彩胆拖计算图| www.10ot.com-福彩网是真是假| www.052993.com-江苏快三购买网站| www.216432.com-乐和彩登陆-| www.34177.cc-吉林快三乐彩| www.390268.com-福彩3d熊猫-| www.381479.com-星期五彩票-| www.6306.top-3d彩库-| www.28765.cc-浙江体彩飞鱼论坛| www.068930.com-网上代玩彩票赚佣金| www.63ul.com-彩票网租-| www.1823.top-福中彩奥门新萄京| www.753612.com-彩票全买需要多少钱| www.054982.com-出租体育彩票机器| 亿彩www.6832u.com| www.912124.com-开个体彩店有任务吗| www.96un.com-节目彩排的心情说说| www.5278.live-搜狗彩票怎么玩法| www.013885.com-七星彩割码规律图| www.561092.com-彩票中奖计算公式| www.788269.com-2019年彩礼标语| www.874440.com-福彩快3012路| www.961726.com-彩友网免费资料| 彩天下www.196062.com| www.1397.cm-简单水彩画图片大全| www.8329.cn-心灵码仙七星彩最新| www.845945.com-博纳彩票网址| www.924477.com-6e6e彩票-| www.982919.com-买彩票算不算赌博| www.be75.com-喜乐彩历史中奖| www.185217.com-关于别人带着玩快三| www.8at.com-吐槽彩票中奖| www.43654.com-爱乐绣体育彩票购彩| www.259681.com-体彩选号助手下载| www.761272.com-好客彩app-| www.757009.com-工地彩钢围挡预算| www.851030.com-好博时时彩-| www.953001.com-广东彩灯厂-| www.sm32.com-重庆时时彩官方通知| www.618632.com-乐彩票论坛-| www.702772.com-竞彩通知-| www.786556.com-极速分分彩票| www.871310.com-快三模拟器-| www.971829.com-湖北制造假彩票案| www.ap8.cc-福彩排列七-| www.xu13.com-彩票能多买几期的吗| www.9327.net-乐猫彩票网站| www.cai9600.com精彩十分玩法| www.0yq.com-体彩和福彩哪里买| www.75al.com-幸运五分彩真的假的| www.561037.com-彩票200期走势图| www.559093.com-体彩门店申请| www.781764.com-福彩3d双胆分解| www.04237.com-足彩概率漏洞| www.500319.com-分分彩破解-| www.588598.com-大地彩票777dd| www.516508.com-快三龙多少期必断| www.344578.com-体育彩票排七| www.640406.com-福利彩票赔率| www.919646.com-重庆时时彩的算法| www.g73.com-排列三彩宝网试机号| www.9321.biz-快三和值10是大吗| www.549133.com-彩播直播app| www.610612.com-澳客网大发快三漏洞| www.763745.com-快三豹通中了多少钱| www.906270.com-彩色粉末是什么东西| 500彩票www.50052j.com| www.026895.com-玖富彩票登陆| www.318459.com-火箭彩票下载| www.60458.cc-北京体育彩兑奖中心| www.988850.com-数字彩票双色球奇偶| www.255987.com-时时彩后三一码诀窍| www.sm65.cc-竞彩投注技巧口诀| www.92ac.com-众乐彩票官方网站| www.036667.com-足彩2串1中奖规则| www.533365.cc-专业福彩app| www.651322.com-加拿大5分彩开奖| www.854494.com-江苏快三怎么破解| www.952440.com-k彩福地网站| 彩票驿站www.621416.com| www.677974.com-福彩3d论坛坛| www.5uo.com-4月9日河北快三| www.505970.com-买彩票的案件| www.621844.com-体彩排列五图综合版| www.752257.com-彩牛美缝剂商标| www.856968.com-vr3分彩-| www.936093.com-速8彩票真假| www.981039.com-七彩意义-| www.u97.cc-玄武彩票-| www.638283.com-色彩画人物-| www.753207.com-9d彩票网址-| www.826331.com-933手机彩票| www.886484.com-优彩社区-| www.947397.com-福彩七加一开奖结果| www.987184.com-试玩账号的彩票| www.up32.com-36全国彩票开奖| www.066231.com-900彩票提现不了| www.375442.com-福彩几个号码算中奖| www.644773.com-35彩票中心-| www.382125.com-2元彩票全中多少钱| www.948059.com-四川省体彩中心主任| www.669378.com-双色球彩票有效期| www.759646.com-体育彩票时时彩11| www.838586.com-澳彩欧赔转换亚盘| www.907196.com-彩票种类介绍及图片| www.968341.com-胜负彩开奖奖金| 500彩票www.504277.com| www.49388.cc-极速时时彩是否正规| www.2124.vip-七乐彩玩法介绍大全| www.07679.com-中彩那天的主要内容| www.48990.com-中国福利彩票彩报图| www.92261.cc-易彩智能投注软件| www.ef79.com-百姓彩票手机版| www.373058.com-彩票排列三玩法| www.517952.com-北京乐赢彩票| www.474546.com-金誉彩票网软件| www.659963.com-重庆时时采彩乐彩图| www.772840.com-彩豆京东理财靠谱吗| www.938935.com-澳客体彩足球强哥| www.zw65.com-上海彩票站申请| www.78182.cc-彩票的中奖概率是| www.296905.com-数学教授彩票大奖| www.68275.cc-彩66彩票-| www.051718.com-体彩金7乐-| www.38421.com-大彩网七星彩第一位| www.530084.com-南国体彩经典彩版| www.322595.com-竞彩中奖单-| www.100282.com-查互联网销售彩票| www.157469.com-竞彩群-| www.233241.com-手机彩票走势图软件| www.304427.com-亿网彩票app下载| www.365812.cc-什么彩铅涂得逼真| www.441523.com-国际福利彩票怎么玩| www.518700.cc-惠民彩票安全吗| www.578371.com-甘肃省11选5体彩| www.347887.com-七乐彩骗局-| www.56682.cc-我玩时时彩输了想死| www.059806.com-小鹿多彩-| www.798096.com-易彩网怎么下载| www.15425.com-嘉兴体彩网-| www.441777.com-七星彩排序-| www.236964.com-一分快三开奖历史| www.322545.com-盛兴彩票v3入口| www.441200.cc-四川彩票官网首页| www.207063.com-魔方彩票是真的吗| www.502297.com-最全白菜网彩金| www.776.red-时时彩脚本辅助| www.479122.com-江西体彩有哪些|