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天

知道了
1分快三 www.26622.com-七星彩内部透露| www.89778.cc-彩票伪随机数生成器| www.965460.com-78彩票是什么| www.96978.com-竞彩2串1交易排行| www.625021.com-苏宁彩票快3| www.783402.com-七乐彩幸运选号| www.lb89.com-下载购彩注册| www.66457.com-福利彩票刮刮乐金条| www.156232.com-彩票历史号码查询| www.549623.com-在线购买足彩| www.539423.com-彩票是什么时候发行| www.899745.com-彩81网站-| www.855550.com-彩票:奖-| www.008363.com-泰安多少体彩站| www.978950.com-360彩票苹果版| www.de13.com-秒速快3是什么彩票| www.441858.com-邯郸市体彩中心地址| 彩票大家乐www.21202l.com| www.9746.biz-19032七星彩| www.663194.com-摩登彩票是正规的吗| www.80220.com-河北快三近50期| www.30952.com-时彩计划软件手机版| www.233764.com-福彩3d和尾走势图| www.364009.com-刚力彩芽下海了吗| www.169081.com-湖北快三规则| www.356363.com-pp彩票正规合法吗| www.545678.cc-足彩竞猜310| www.776783.com-竞彩大小球-| www.27228.cc-新宝彩票手机官网| www.361717.cc-中国网易彩票app| www.43642.com-旺彩全国开奖| www.lb.com-京东彩票玩快三| www.208563.com-双彩开奖走势图| www.663115.com-牛彩一句定三码9| www.515922.com-足彩跟单计划| www.il41.com-足球彩票软件| www.l22.cn-103彩票站-| www.144153.com-竞彩赔率规律| www.176360.com-快三在线稳定计划网| www.441449.com-彩乐堂tm6.pw| www.541742.com-完美彩票彩79| www.621912.com-五福彩app有哪些| www.696562.com-新浪爱彩首页| www.788598.com-竞彩篮球受注赛程| www.35512.cc-3d彩票模拟投注| www.092639.com-高手彩坛彩民盛杰| www.765282.com-大众彩票网骗| www.877534.com-时时彩专家网| www.954668.com-代购美国彩票合法吗| 68彩票www.68682j.com| www.xp90.com-山东体彩扑克3开奖| www.48nc.com-重庆私私彩开奖| www.094707.com-福彩计划公式| www.538009.com-颜色的彩色-| www.58581.cc-深圳一定牛福利彩票| www.059109.com-竟彩即时比分| www.2mq.cc-体彩能买足球吗| www.000614.com-浙江嘉兴福彩官网| www.099675.com-苏快三走势图| www.jd31.com-福利彩票兑奖流程| www.i36.club-立彩彩票三期| www.061133.com-欢乐彩票-| www.73735.com-福建泉州体彩聊天室| www.uh59.com-福利彩票是真的| www.890077.com-体彩篮球-| www.ca65.com-河北燕赵风彩排列5| www.49931.com-彩神国际官方| www.364606.com-去哪里买世界杯彩票| www.341536.com-98吉林快三群| www.502428.com-足彩胆拖是什么意思| www.270317.com-幸运快三怎么投注| www.526928.com-今晚竞彩足球比赛| www.660723.com-福体彩每日开奖| www.766908.com-信彩彩票官网首页| www.848722.com-重庆时时彩团队招人| www.921166.com-3d彩票技巧心得| www.990604.com-彩八仙苹果客户端| www.bk30.com-106官网彩票平台| www.h18.biz-七星彩兑奖-| www.935717.com-幸运彩票破解app| www.i92.shop-乐彩3d论坛杀码| www.593755.com-龙江网络七彩云投屏| www.755484.com-旺彩福彩3d下载| www.2869.cm-七星彩开历史奖结果| www.vu11.com-惠民彩-| www.214966.com-赢彩彩票-| www.931508.com-天空彩与你同行资料| www.9ve.com-福彩3d断组规律| www.297778.com-彩票500够彩大厅| www.974171.com-福彩刮刮乐编码| www.qg19.com-八亿彩平台-| www.95sm.com-香港赢彩网网址| www.8688.cc-中彩网体育彩票| www.879659.com-快乐五分彩-| www.962747.com-3d彩圣字谜总汇| 幸运彩票www.915366.com| www.811762.com-微博怎么买彩票| www.850842.com-出生日期怎么买彩票| www.41wn.com-ios唯彩看球| www.240144.com-中彩娱乐网站是| www.062068.com-彩珉之家-| www.73oa.com-手绘荷花彩铅画教程| www.312332.com-彩票销售聊天技巧| www.4443.in-奇妙时时彩软件下载| www.55850.com-k彩最新版本下载| www.986616.com-足彩310预测| www.hq68.com-黑龙江体彩网大乐透| www.34062.com-卖彩票的人怎么赚钱| www.31lr.com-昨天3d彩票开奖号| www.752.mobi-时时彩后二和值| www.5019.com-6s彩色钢化膜| www.676343.com-明天福彩开奖吗| www.758558.com-微彩站是哪里出的| www.829650.com-天空彩tkkjcc| www.918506.com-篮球彩票软件推荐| www.970501.com-腾讯分分彩技巧| www.bf7.com-北京福彩快3千期图| www.mu51.com-最正规的购彩平台| www.v36.com-牛彩网_彩搜网| www.44nw.com-民政部彩票造假案| www.32326.com-河南省体育彩票申请| www.264833.com-北京快三规律口诀| 中国福利彩票www.33588a.com| www.8952.xyz-大乐透旺彩推荐| www.671356.com-六和彩资料全部| www.850449.com-福彩3d试-| www.49zl.cc-中国福彩彩吧图库| www.0199.vip-新利彩票走势图大全| www.8855.cm-中国彩票第一狂人| www.56178.cc-8炫彩彩票规则介绍| www.020861.com-网络销售彩票| www.632469.com-福利彩票投注站注销| www.764433.com-足球4场进球彩对阵| www.984066.com-58彩票安卓版| www.kj14.com-瑞彩网彩票平台| www.61gr.com-体彩6+1开奖| www.2614.live-第37的彩票结果| www.34366.cc-建设银行彩票定投| www.050400.com-玩黑彩赔钱了| www.88674.com-孕妇梦见中彩票大奖| www.766993.com-竞彩网比分直播直播| www.6123.in-香港博中彩-| www.371763.com-彩天下是真的假的| www.811826.com-彩坛至尊六合网| www.0260.top-时时彩怎样看中奖没| www.5986.pw-体彩排列三论坛网| www.19235.cc-没有彩票可以领奖吗| www.63040.com-江苏体彩500| www.8040.in-好看又简单的水彩画| www.75958.com-彩票有折痕能兑奖吗| www.088019.com-双赢彩票正规吗| www.505979.com-体彩中心案-| www.2550.vip-时时彩趋势k线软件| www.577591.com-福彩三d图谜第二版| www.672110.com-全民彩金下载| www.740085.com-澳彩app免费下载| www.807004.com-七号彩平台-| www.285266.com-时时彩一星倍投表| www.358646.com-美国彩票兑奖有效期| www.518587.com-辽宁彩票中心| www.619505.com-体育彩票怎么过户| www.732290.com-春秋彩票app| www.2397.vip-青娃彩票网站导航| www.027679.com-体彩刮刮乐代码|