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天

知道了
彩01彩票 www.n02.xyz-彩票送礼金网站大全| www.167856.com-河北彩票快3| www.99365.com-红五说彩-| www.383666.cc-今晚福彩开好| www.230291.com-幸运时时彩app| www.356675.com-宁波某公司彩票中奖| www.472190.com-买彩票中奖后的小说| www.6670.biz-360手机彩票| www.075091.com-彩.票开奖号| www.9516.xyz-海南私彩为什么火| www.016477.com-福彩高频彩是真是假| www.127007.com-彩客网软件-| www.237641.com-广西体彩网官方首页| www.227330.com-上海快三开奖号| www.4250.biz-诚信彩票网cxcp| www.11860.com-大乐透体彩开奖规则| www.67782.cc-网购彩票算赌博吗| www.567733.com-阳光彩票官网登录的| www.693076.com-抢彩票违法吗| www.816484.com-福彩3地开奖号| www.901146.com-中国体彩报app| www.979499.com-好彩烟价格表和图片| www.de54.com-网上认识的彩票男| www.xr85.com-彩票到底有没有技巧| www.2995.biz-鸿运网购彩大厅| www.9026.com-竞彩篮球专家天道| www.11267.cc-足彩单场竞猜网易| www.88587.cc-微彩吧是骗人的吗| www.hv97.com-e球彩可以包四场吗| www.894141.com-冠军集团彩票app| www.516684.com-买体彩哪个软件好用| www.f26.cn-乐彩网提现-| www.71824.com-皇角彩票-| www.308737.com-购买彩票投注站点| www.767433.com-72期福彩独胆| www.921776.com-大发时时彩计划预测| www.cp8255.com-福利彩票快3湖北| www.754158.com-彩经网手机app| www.900087.cc-22彩票网-| www.51ob.com-首页新彩票走势图| www.82598.cc-足彩14场贴吧| www.035604.com-福利彩票励志语录| www.9740.in-彩宝彩票可以买吗| www.632466.com-福建36迭7彩票| www.t20.mobi-蚂蚁彩票官方网站| www.zh8.com-江苏快三号码推荐| www.437773.com-爱彩乐上市-| www.766493.com-彩客彩票三分二28| www.964545.com-128福彩幸运快三| www.kx50.com-长城彩票app| www.691.in-体育七星彩几点停售| www.234760.com-体彩竞彩网-| www.366229.com-儿童彩笔画-| www.632033.com-七彩虹显卡个人送修| www.796182.com-印尼分分彩官网| www.944618.com-百万彩票网骗局事件| www.949508.com-2018彩库宝典| www.et79.com-老版彩神8-| www.58gb.com-河北银行库管买彩票| www.3262.com-彩膜好还是钢化膜好| www.14040.com-澳门竞彩-| www.99059.com-手机网上如何买彩票| www.96153.cc-福利彩票社会贡献| www.07yj.com-彩铅怎么排线| www.8995.top-新加坡30秒彩骗局| www.56685.com-速彩网邀请码| www.023436.com-赌彩票的危害| www.141195.com-官方时时彩网投平台| www.580069.com-澳洲幸运彩官网| www.500833.com-一寸彩照是什么| www.619959.com-福彩3d夏天开机号| www.863421.com-福利彩票是什么性质| www.972896.com-日彩网怎么赚钱| www.gg59.com-彩客网完整比分直播| www.29.cm-福彩豫彩通查询| www.364.in-爱彩人怎么样| www.166162.com-快三玩法中奖介绍| www.254571.com-好彩网60123| www.450542.com-3d彩宝彩票官网| www.5390.cm-快三如何买最划算| www.396168.com-体育彩票星期几能买| www.952.tv-彩票的运算公式| www.7hs.com-彩票微信如何推广| www.21om.com-qq怎么加彩票群| www.0232.top-赢彩票开奖-| www.8271.cn-彩票为什么没人造假| www.624215.com-福彩3d速查表大图| www.9595.org-老时彩开奖-| www.319613.com-福彩三的和值表视图| www.158745.com-摆渡龙江体彩| www.281085.com-私彩报警退钱| www.466.in-1012期彩票-| www.624815.com-速8彩票平台官网| www.pw2.com-百宝彩走势图| www.10jv.com-时时彩独胆必中方法| www.1073.com-网赌分分彩经历| www.539507.com-彩宝贝预测汇总对比| www.639641.com-网投快三是什么彩票| www.449912.com-大同彩票站-| www.538283.com-彩云国物语结局| www.600036.com-彩票买几注能中大奖| www.667180.com-福州体彩领奖地址| www.i11.cn-明天彩票开奖号码| www.010.mobi-彩神平台提现| www.3398.cm-彩票注册送58| www.827830.com-彩票跟单什么意思| www.898232.com-在哪买足球彩票| www.976045.com-开封通许结婚彩礼| www.cp499.com-福彩快三是真的吗| www.127042.com-长沙快三查询| www.339112.com-重庆时时彩网站登录| www.593122.com-电视剧彩虹第一集| www.737081.com-体彩大乐透软件安装| www.844801.com-福利彩票的社会意义| www.960640.com-时时彩注册送18元| www.wl6.cc-彩票里的屠龙| www.11tc.com-彩天下是真的假的| www.88pz.cc-中国彩票和美国彩票| www.1380.cn-快三如何快速回血| www.846320.com-赛事资讯竞彩网| www.929928.com-陕西彩票快乐十分| www.980960.com-四川福彩快3| www.ms03.com-快三选一个号码| www.447858.com-有没有足彩微信群| www.553599.com-竞彩中奖案例| www.611222.com-彩票开机号开奖| www.075738.com-福利彩票最大号码| www.917899.com-彩虹宝宝动画片全集| www.988145.com-佰萬彩票官网| www.ax39.com-澳门快三开奖查询| www.365932.cc-国产水溶彩铅哪种好| www.39348.com-新快报轻报纸福彩| www.96931.cc-新浪爱彩开奖结果| 开心彩票www.ck6587.com| www.148068.com-体彩大赢家app| www.ax39.com-澳门快三开奖查询| www.614547.com-福利彩票是正规的吗| www.57651.cc-欢乐彩开奖-| www.363825.com-网络用语彩虹屁| www.789986.com-天天中彩吧图谜大全| www.tt03.com-yy彩票网址-| www.360.tm-香港皇冠彩票| www.35597.com-网易彩票杀号专家| www.023523.com-福星彩开奖现场| www.172395.com-江西快三跨度走势图| www.344128.com-周公解梦彩票解码器| www.l43.com-彩神通关注码及金码| www.806969.com-7号彩票安全吗| www.330202.com-电子无需申请送彩金| www.089354.com-彩票福彩排三| www.09fh.com-福利彩8彩种| www.39310.com-中日中彩怎么加的| www.997353.com-北北京快三-| www.260426.com-手机上怎么买彩票| www.388732.com-谷歌分分彩开奖原理| www.495055.com-彩票骚扰短信| www.556286.com-哪个彩票app靠谱| www.626632.com-鑫彩网平台怎么样| www.693832.com-体彩官网下载软件| www.767422.com-福彩3d开奖72期| www.838174.com-七星彩奖号-| www.900834.com-耽美彩漫肉少爷三人| www.965296.com-uu彩票跑路-| 中彩网www.91233b.com|