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.021255.com-彩天下平台开户| www.999141.com-彩乐汇快三是真的吗| www.29.biz-足彩赚钱的人多吗| www.760180.com-福彩刮刮卡任务| www.925709.com-彩富网香港资料大全| www.di64.com-彩票图迷查询| www.085104.com-星空彩票官方ios| www.175720.com-快三计划群真的假的| www.254412.com-亚博彩票下载安装| www.346253.com-大地彩票是真的吗| www.446608.com-d8彩票官网app| www.555923.com-078彩票经销商| www.653558.com-玖亿彩票是真是假| www.750738.com-天天中彩邀请码| www.858627.com-彩神幸运飞艇破解版| 大赢家彩票平台www.271696.com| www.ms22.com-彩票几个数字算中奖| www.93mt.com-879彩票官网| www.4947.vip-彩兔迷-| www.22580.com-彩108彩票网站| www.82517.com-体彩胆码杀码图库| www.052858.com-手机购彩大发快三| www.3786.biz-hk百彩网开奖资料| www.358381.com-福彩3d对子多少钱| www.9556.biz-狂欢彩票-| www.pz20.cc-彩票料大全-| www.50es.com-烟台体彩管理中心| www.792972.com-阜阳福彩中心在哪| www.390482.com-网络时时彩怎么报警| www.yl02.cc-彩计划9cbcc| www.80fm.com-百盛彩票提现| www.7445.top-上海体育彩票店| www.49334.com-致富彩江苏快三| www.042247.com-竞彩篮球奖金计算器| www.507139.com-福彩新彩票网| www.930563.com-e球彩复式投注| www.063726.com-彩票店的经营方法| www.149525.com-彩民乐大乐透| www.615103.com-今日说法彩票纠纷| www.784522.com-乐博彩票下载| www.4505.tv-彩票站买什么赚钱| www.590267.com-东莞市体育彩票地址| www.262116.com-黑客彩票快三软件| www.382999.com-大乐透中奖彩票样票| www.333343.cc-彩票送人中奖| www.520606.com-快三限号销售| www.689096.com-山东彩沙龙论坛| www.891842.com-实时彩-| www.sm3.com-福利彩票规则| www.373859.com-网易彩票支付不了| www.388486.com-彩友会黑钱-| www.579122.com-福彩3d公式怎么算| www.723605.com-彩票哪买的多| www.835133.com-好彩双爆焦油| www.116408.com-彩票分析师证怎么考| www.542400.com-3d今天彩图-| www.722716.com-足彩负什么意思| www.972064.com-全国体彩22选5| www.43.hk-国家高频彩票害人| www.448362.com-湖南3d彩票论坛| www.557059.com-奔驰彩票是干什么的| www.712119.com-e彩乐手机登录| www.025882.com-快频彩票下载| www.6119.com-容易中奖的彩票号码| www.136460.com-一分钟的彩票能玩吗| www.649069.com-博汇彩票-| www.034960.com-31彩-| www.169714.com-一分快三走势图分析| www.nq43.com-江西新快三和值| www.p29.org-广西福利彩开奖结果| www.242406.com-彩票三个红号有奖不| www.019843.com-时时彩中彩票| www.01402.com-中彩快三计划破解版| www.755681.com-3d旺彩网3b字谜| www.886258.com-彩票对压原理| www.973164.com-彩虹授权官网| www.cp8708.com-网络快三合法吗| www.wn29.com-快三012路秘籍| www.16kx.com-幸运彩票下载900| www.577142.com-陕西快开型彩票| www.662129.com-竞彩比分预测推荐| www.765898.com-大发快三下期算法| www.831179.com-彩票网售2019| www.934539.com-快乐彩软件-| www.997255.com-竞彩足球官网| www.fl56.com-四川福彩快三| www.b85.net-体彩游泳夺金视频| www.39kn.com-青海省福利彩票| www.626.cn-福彩12选5规则| www.221132.com-彩票追号神器| www.44od.com-竞彩外围反奖率| www.999879.com-网易彩票4.29| www.hf49.com-掌中彩彩票平台| www.02am.com-表示彩虹样子的词| www.79ik.com-有个小说是中彩票后| www.za94.com-01彩票安卓版| www.004676.com-体彩试机号近10期| www.789417.com-体育彩票号码是什么| www.883915.com-百姓彩票网投领导者| www.983338.com-网上彩票诈骗报警| www.cp6650.com-辽宁体彩-| www.oc65.com-彩票中奖全部查询| www.t67.space-谦喜彩票计划网| www.45yd.com-足球彩票漏洞| www.21sp.com-怎么举报天天中彩票| www.244392.com-京东彩票客服| www.365257.cc-南方彩票双色球报刊| www.506236.com-外国能买福利彩票吗| www.751030.com-梦见刮彩票上瘾| www.885820.com-福利彩票选号机| www.yr17.com-竞彩平负是什么意思| www.056.cn-体彩屋大厅-| www.73452.com-牛彩网藏机图汇总| www.1946.vip-凤彩网3d热门推荐| www.883650.com-手机彩票站官方网站| www.194633.com-冮苏e球彩开奖结果| www.998676.com-中国体育彩票网点| www.062868.com-手机淘宝福彩| www.992768.com-杨震胜负彩推介| www.025834.com-彩票套利方法大全| www.314462.com-体彩吻买技巧| www.489609.com-网上代理时时彩佣金| www.599088.com-大透乐彩票开奖时间| www.739064.com-五福彩票靠谱吗| www.841873.com-足球彩票费用一年| www.939027.com-发财网彩票-| www.995871.com-80彩票是骗人的吗| www.511171.com-彩虹天堂歌词含义| www.668944.com-贴吧卖彩票-| www.777529.com-福彩三地杀码图| www.915002.com-优信快三彩票| 8号彩票www.81520g.com| www.si01.com-重庆时时彩官网| www.06.la-玩私彩处罚-| www.79gx.com-小鱼版彩吧图库背面| www.3061.win-福利彩票开-| www.130470.com-一一彩票开奖结果| www.695678.com-彩客网混合-| www.801026.com-体彩3d二元网| www.965393.com-福彩自助下载app| www.tq81.com-彩票平台代理刷佣金| www.46oq.com-体育彩票申请条件| www.374918.com-中国彩富足彩网| www.693459.com-51彩票最新版下载| www.11272.cc-烟台福利彩票网| www.021459.com-约彩368-| www.12543.com-快三平投计划| www.17zu.com-体彩大乐透历史同期| www.93cd.com-彩票情缘在线阅读| www.692739.com-6678彩软件下载| www.799700.com-什么彩票注册送20| www.670846.com-色彩调和-| www.878717.com-中国福彩积分卡查询| www.300044.com-好彩0567最新版| www.425729.com-彩霸王正牌资料| www.539844.com-时时彩跨度的用法| www.657020.com-黑彩稳赚计划| www.716539.com-体彩包括什么| www.792678.com-阜阳彩票中心电话| www.863958.com-体彩开奖信息记录| www.933909.com-彩票指南电子版订购| www.978740.com-500w彩票网网址| www.ak02.com-七星彩最新开奖结果| www.192848.com-大发快三中奖技巧|