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.959164.com-快三坑人-| www.8776.com-彩票亏损分红套利| www.539563.com-可以买釉中彩餐具吗| www.7730.cc-印尼分分彩-| www.797082.com-乐彩28-| www.932921.com-118彩票合法么| www.57389.com-彩神通软件手机版| www.218902.com-佰萬彩票-| www.460042.com-新浪竞彩比分360| www.88501.com-永诚彩票注册| www.088399.com-下载福彩网站的网址| www.17133.com-e彩堂app下载| www.wp87.com-南方双彩首页大全| www.77af.com-刮刮乐彩票中奖图片| www.75qs.com-神奇数字组合与彩票| www.6655.cm-天天分分彩计划| www.21296.cc-彩票店怎么挣钱| www.498167.com-日本彩票中国人中奖| www.660392.com-腾讯ai彩预测| www.827446.com-澳门三分彩开奖记录| www.912272.com-洛神体彩店安全么| www.996600.com-黑龙江省福彩| www.12as.com-福彩3α试机号| www.9op.com-福彩双色球中彩视频| www.82yh.com-彩云网盘官网| www.4973.biz-梦见自己彩票中大奖| www.13581.cc-金祥彩票网址注册| www.ix23.com-皇都彩票用户登录| www.43wo.com-汇彩彩票官网app| www.149860.com-必中彩票是个坑| www.262593.com-湖南福彩-| www.133842.com-淘彩票注册风险| www.yf0.cc-快三时时计划表| www.215575.com-七乐彩中奖号码图表| www.74bs.com-彩银制品价格骗人| www.143247.com-彩8彩票c85-| www.278387.com-五分快三彩票网| www.939388.cc-亚博app买足彩| www.ek.com-江西快三app下载| www.011405.com-福利彩开奖号| www.301496.com-网易大乐透彩票预测| www.404512.com-彩库宝曲最新开奖| www.50ad.com-足球竞彩如何跟单| www.705791.com-福彩3d复式奖金| www.785154.com-大胜彩票234| www.873410.com-为什么限制体育彩票| www.948335.com-新彩吧论坛-| www.pz78.com-彩票66软件-| www.173888.com-彩神大发app| 大赢家彩票平台www.721709.com| www.sk81.com-重庆福彩网-| www.4728.wang-彩票走势图中彩图表| www.7814.cc-足彩投注技巧汇总| www.992744.com-江苏快三可以玩吗| www.jr20.com-乐和彩票客服电话| www.231954.com-福彩字谜画谜| www.652550.com-乐彩客手机app| www.31589.cc-麒麟足彩-| www.413963.com-喝彩人的意思| www.554422.com-竞彩足球宣传语| www.681085.com-网赌彩票心得| www.a82.org-如意彩票全天计划| www.113401.com-各种釉彩大瓶唐宋清| www.qy2.com-中彩论坛资料| www.345877.com-皇家快乐彩开奖记录| www.498500.com-彩票代打赚佣金| www.579028.com-淘宝彩票在哪买| www.0098.live-彩票店红火的名字| www.9425.loan-七星彩中二个数字| www.092237.com-体彩福建36选7| www.956756.com-七星彩中了三个数| www.cai4277.com内蒙快三开桨| www.094093.com-买彩票上瘾人的心理| www.uh34.com-谁有彩票邀请码| 福彩www.2109d.com| www.978690.com-福彩3d2元走势图| www.022989.com-福彩3d小图-| www.585971.com-彩票平台代理贴吧| www.716128.com-宝马彩票咋样| www.820849.com-西昌拆除彩钢瓦| www.lj08.com-九万彩票app| www.143068.com-大发云系列彩票| www.254695.com-湖北快三昨日未出号| www.352573.com-彩票33是正规的吗| www.957709.com-228台湾乐透彩| 双彩网www.179012.com| www.404491.com-彝族结婚风俗彩礼钱| www.551687.com-彩乐网zz88cc| www.627720.com-经典彩调-| www.710342.com-彩票cms-| www.782505.com-52彩店app-| www.858419.com-三彩官方旗舰店毛衫| www.916587.com-黑客攻击私彩案件| www.421618.com-澳客竞彩胜负| www.567203.com-彩票平台会控制输赢| www.629937.com-足彩快报官网| www.703234.com-万家彩票注册| www.783978.com-105官网彩票下载| www.862407.com-彩票书籍在线閲读| www.948722.com-鑫彩网彩票客户端| 趣彩网www.qucp3.com| www.505470.com-逆袭分分彩安卓版| www.96239.cc-18130期胜负彩| www.086343.com-海南时时彩官网开奖| www.178501.com-齐鲁彩票-| www.17qz.com-正规的合肥体彩店| www.318538.com-福彩双色球字谜总汇| www.418502.com-时时彩哪种玩法稳| www.98oi.com-彩票查询彩宝网| www.4930.org-世博彩黑钱吗| www.231382.com-极速快三大小计划网| www.293690.com-苏州福利彩票网| www.365008.cc-北京快三加奖了吗| www.789352.com-故宫彩妆-| www.439341.com-丢彩票得了抑郁症| www.228622.com-河北福利彩票快三| www.917033.com-简单彩铅画教程| www.983784.com-福彩双色球咋中奖| www.hv15.com-快三邀请码可以获得| www.236166.com-1360彩票-| www.413686.com-台球彩8对战| www.3569.vip-中彩网能挣钱吗| www.96jw.com-87彩店邀请码浙江| www.178813.com-体彩浙江6+1| www.586015.com-何明推荐今天七乐彩| www.aj37.com-七星彩太假了| www.i86.cn-福彩天吉预测分析区| www.952906.com-丰彩的中奖率怎么样| www.690365.com-高频彩票官方导航| www.870815.com-彩票投注翻倍计算器| www.b99.xyz-七星彩私彩大奖软件| www.065202.com-大奖网能买彩票吗| www.173920.com-哪个正规平台有快三| www.8018.cn-海南时时采彩开奖| www.974752.com-中国体彩唯一官网| www.yd06.com-派彩每日推荐双色球| www.08259.com-湖南福彩投注站图片| www.35685.cc-福彩3d豹子列表| www.7379.cm-竞彩店倒闭了| www.210775.com-北京快三走遗漏| www.763536.com-休彩七位数开奖查询| www.56066.cc-网易彩票在线投注| www.0479.date-网上购彩是真的吗| www.452054.com-快三分分彩技巧| www.837151.com-立彩彩票软件可靠吗| www.960536.com-a9彩票平台-| www.cp1052.com-快三分析软件下载| www.783722.com-体彩ios-| www.7527.loan-彩票店内还可卖什么| www.15pr.com-分手彩礼要给男方么| www.019167.com-牛彩首页-| www.63726.cc-古建筑彩绘图片| www.208106.com-彩票稳赚不赔的买法| www.560453.cc-体彩地方彩-| www.332577.com-吉林快三庄家会输么| www.494681.com-博彩插件-| www.08fo.com-87.cn彩票-| www.34702.com-福彩3d开今天一| www.71744.com-今年的彩票是多少号| www.hm76.com-3d中彩网首页| www.ts18.com-体彩开奖查询历史| www.3db.com-淘彩吧论坛百度知道| www.37737.cc-彩虫-| www.896355.com-最好的快三走势图|