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天

知道了
亚洲28 www.30223.com-体彩排三预测总汇| www.024252.com-南京福彩中心地址| www.116192.com-网站彩票分析师| www.203652.com-福彩5d是每天开| www.289688.com-977cc官网彩票| www.454084.com-乐彩国际平台官网| www.560129.com-网购彩导师-| www.639650.com-竞彩销售管理细则| www.775838.com-分分时时彩五星计划| www.874607.com-关于彩票的赌博种类| www.998190.com-神州分分彩计划软件| www.bw71.com-福彩快三计划是什么| www.wb45.com-吉林快三两码遗漏i| www.23mh.com-福彩凤彩网三d胆码| www.0241.in-玩福彩快-| www.7518.wang-7星彩所有开奖结果| www.30311.com-重庆福利彩票双色球| www.85499.cc-668彩票登录| www.051820.com-高频彩平台出租源码| www.180007.com-上海快三开奖结果| www.261337.com-彩八彩票-| www.365628.com-快三跨度中奖| www.470062.com-买足彩靠谱吗| www.563648.com-有什么彩票软件| www.640409.com-高兴彩票-| www.828577.com-6118n彩票注册| www.912272.com-洛神体彩店安全么| www.982068.com-江西彩票助手合法吗| www.oi63.com-七星彩开奖玩法介绍| www.6lc.com-365足球竞彩官网| www.73dq.com-福彩杀跨杀尾大全| www.2010.org-和彩放题爆光| www.8055.cc-云南时时采彩开奖| www.31572.cc-足球竞彩购买| www.78250.com-湖南幸运快三走势图| www.034501.com-焦点蓝彩开奖| www.192785.com-也买彩-| www.269857.com-彩9官网-| www.377532.com-双色球彩报图片| www.514505.com-吉林快三2同号规矩| www.591254.com-邯郸彩礼最贵的地方| www.672075.com-快三豹子中奖| www.755607.com-重庆快三链接| www.881843.com-唰福彩-| www.967247.com-网上玩彩票被骗| www.cai6022.com破解快三开奖软件| www.mt92.com-休闲快三慢动作| www.6kb.cc-彩票拾取算法| www.67un.com-网上投注足彩app| www.1188.pw-快三怎样测龙| www.9595.org-老时彩开奖-| www.53972.cc-彩票77755-| www.004657.com-竞彩足球可以胆拖| www.080528.com-七星彩190-| www.149325.com-福利彩票什么叫倍投| www.276533.com-快三反倍投教学| www.369502.com-福建体彩聊天直播| www.476013.com-北控国彩坑人| www.561217.com-青岛市体彩中心电话| www.634311.com-南充七彩坊内衣| www.760957.com-唯彩看球直播| www.854665.com-华夏彩票坑人| www.922494.com-上海招聘竞彩分析师| www.983570.com-贵州快三投注模拟| www.jq22.com-江苏快三把我坑死啦| www.g58.wang-经彩网排列五走势图| www.42oi.com-时彩稳赚技巧| www.527.cc-喝彩中华2018| www.4822.biz-福彩三的九宫八卦| www.03920.cc-辽宁省体彩中心地址| www.51415.com-糖果彩是不是正规的| www.96272.cc-千亿彩票三-| www.061518.com-彩客网能提现吗| www.278311.com-时时中彩票手机登录| www.366534.com-晨光48色彩铅色卡| www.466658.com-洛杉矶国际快三网址| www.557052.com-创意线描水彩范画| www.631365.cc-彩票开奖怎么看| www.1894.com-快三的计算公式| www.210104.com-江苏快三官方网站| www.910793.com-山东快三-| www.39257.com-重庆福利彩票十分钟| www.87386.com-鸿运彩票体现不了| www.042194.com-七星彩开奖计录| www.151588.com-彩票88网站下载| www.237448.com-福彩双色球开奖直播| www.315251.com-腾讯分分彩合法吗| www.391831.com-彩票每天开售时间| www.573122.com-福彩大乐透怎么玩| www.633602.com-易网彩票网彩| www.692152.com-双色走势图彩乐乐| www.771060.com-时时彩什么叫龙虎和| www.899888.cc-彩39彩票苹果| www.958665.com-广州彩票开奖| 奔驰彩票www.29178d.com| www.fg06.com-体育彩票快乐十分钟| www.wb79.com-彩票代玩账号兼职群| www.10oj.com-福彩中心内部号| www.76ta.com-七星彩与双色球| www.1367.xyz-最近中福利彩票的人| www.06706.com-119彩票平台| www.49804.com-能下单的足彩app| www.90954.com-中国福利彩票好彩3| www.047602.com-500万彩票比分直| www.159716.com-竞彩258官网| www.242790.com-彩票江苏快三| www.314646.com-极速3d彩票规则| www.380239.com-体彩票开奖直播渠道| www.520635.com-3号彩票登录首页| www.586192.com-66微彩-wap站| www.654525.com-易彩堂合不合法| www.759977.com-时时彩票计划稳定版| www.830638.com-会员登录–顶级彩票| www.895007.com-做彩票帮投违法吗| www.951635.com-江苏快三软件制作| www.993104.com-竞彩推荐单场专家| www.bq6.com-砍龙彩票骗局| www.mt44.cc-易盈彩票官网苹果| www.w21.hk-福彩两天计划胆码| www.46ke.com-吉林快三开结果查询| www.477.cx-河南福利彩票查询| www.3869.xyz-福彩3d跨度图| www.8977.org-福利彩票选好法| www.66229.cc-梦到自己中彩票| www.021332.com-太原体彩店-| www.089014.com-休彩开奖-| www.145669.com-567时时彩票下载| www.250677.com-306官方彩票下载| www.316767.com-体彩标志图片大全| www.380504.com-吉林快三图表跨度| www.518258.com-中彩票大奖几率| www.582181.com-福彩门户ok58| www.648669.com-江苏双色球快三| www.751357.com-彩票上写字能兑奖吗| www.814823.com-3d福彩号-| www.872711.com-福彩三的红五图库| www.972354.com-体彩7位数开奖公告| www.mr88.com-k彩福地线路测速| www.i24.xyz-搜索福利彩票信息| www.29lz.com-体育彩票排三试| www.674.in-重庆市体彩中心电话| www.3933.date-玩彩独胆王软件| www.8959.biz-苹果彩名堂-| www.51926.com-体彩排列三72期| www.89972.com-中国七星彩直码| www.037581.com-体彩竞彩一倍多少钱| www.135279.com-恒大彩票-| www.200477.com-熊猫网彩票-| www.263891.com-福彩3d牛材网| www.363129.com-彩虹怎样形成的视频| www.438887.com-特彩吧天空与你同行| www.523393.com-15期喜彩开奖结果| www.618421.com-酷彩吧app官网| www.679565.com-老公买彩票欠下债务| www.751082.com-彩8万下载-| www.809062.com-排列三开机号乐彩网| www.873670.com-掌上彩票app下载| www.975594.com-一定牛彩票网址地址| 百姓彩票www.bxcp3.com| www.gi11.com-上海快三开奖号| www.ut10.com-什么彩票绑卡送彩金| www.9jg.com-四位数彩票有哪些| www.52lo.cc-彩沙涂料-| www.357.org-境外可靠的彩票平台|