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.025371.com-人人中彩票合法| www.070938.com-约彩365安卓下载| www.158708.com-体彩网黑龙江| www.388767.com-头头彩票网-| www.574968.com-博彩投注平台出租| www.669675.com-足彩十四场投注推荐| www.767365.com-分分彩免费计划| www.861855.com-腾讯有5分彩吗| www.982204.com-快三有多少组号码| www.am91.cc-快三缩水软件安卓版| www.959797.com-双面长龙彩票| www.955966.com-彩票倍投骗局| www.cx68.cc-时时彩平台排榜| www.k50.top-玩诺亚彩票被骗了| www.5620.org-彩虹六号国服| www.99437.com-体彩7位数玩法规则| www.815131.com-竞彩群名字-| www.296571.com-彩迷网东方6开奖| www.52156.cc-快三的中奖排列组合| www.431543.com-一张彩票多少钱一张| www.359621.com-冠军宝宝体彩断组| www.189230.com-百姓彩票网-| www.894805.com-双色球彩票中奖情况| 彩乐乐www.cll168.com| www.807867.com-大优彩票怎么样| www.97665.com-山西运城彩礼多少钱| www.097558.com-福彩的利润-| www.155473.com-彩票大师数据分析| www.358346.com-深圳口袋彩店二维码| www.568643.com-约彩彩票旧版本| www.275670.com-北京快三走势图预测| www.14ov.com-网络购彩何时恢复| www.89ox.com-一定牛足彩app| www.5086.pw-属虎彩票号-| www.30360.com-京东彩票怎么买彩票| www.1275.cn-快三路线北京| www.xa31.com-甘肃快三走势图今| www.816918.com-哪些人容易中彩票| www.263617.com-3d新彩吧网-| www.439825.com-中彩那天课文全拼音| www.557153.com-福彩现在主任是谁| www.682355.com-今日福彩3d藏机图| www.2804.cc-时时彩大小计划网| www.66269.cc-电竞彩票下注app| www.051888.cc-九万彩票老版| www.199642.com-五分彩开奖官方| www.318564.com-福利彩票103期| www.545959.com-彩票站室内装修图| www.798048.com-大彩鲸时时彩| www.966510.com-体彩几点停止销售| www.122897.com-酷彩吧是正规公司吗| www.9995.cm-易彩网址多少| www.333138.cc-彩票倍投止损方法| www.82795.com-2013彩票官网| www.377328.com-彩票乐园下载| www.233464.com-众彩彩票首页| www.0729.vip-金发彩票-| www.392518.com-体彩中心开机号| www.639.space-买黑彩违法吗| www.97877.cc-皇家科技时时彩下载| www.fc7.com-重庆时时彩开奖直播| www.xl69.com-十一选五彩票网站| www.74gf.com-体育彩5d开奖结果| www.19ls.com-彩票创始于哪一年| www.562329.com-开心七星彩手机版| www.491077.com-刮刮乐彩票图片| www.402079.com-竞彩足球九场奖金| www.983272.com-87彩店app下载| www.260465.com-新加坡天天彩网址| www.365390.cc-福彩精英免费预测| www.459415.com-1516购彩-| www.279839.com-最新彩票开奖结果| www.11iv.cc-河内五分彩遗漏统计| www.397443.com-快乐三分彩开奖记录| www.789401.com-彩票叫卖顺口溜| www.195601.com-高频快彩时间调整| www.031128.com-致富彩app下载| www.558824.com-夏天雨后彩虹图片| www.397874.com-七星彩不定位中奖| www.729108.com-多玩彩票-| www.914567.com-排列5彩票开奖结果| www.271632.com-好彩1中奖规则| www.0462.net-河南福彩幸运魔方| www.8633.top-派彩乐-| www.994262.com-专业彩票分析大师| www.922015.com-彩678平台正规吗| www.169.mobi-时时彩输了七年| www.3501.top-彩票注册送钱合集| www.f50.net-7乐彩免费推荐| www.555517.com-三位数彩票有哪些| 众彩www.725660.com| www.737698.com-今天3d彩报图库| www.881327.com-一分快三计划中心| www.959176.com-欧洲彩票巨奖骗局| www.lj37.com-中彩拉到哪里领奖| www.125158.com-幸运彩票平台| www.257260.com-腾讯分分彩回血计划| www.386371.com-澳门彩票最新投注网| www.856018.com-彩站宝网页版登录| www.963359.com-贵州体育彩票七星彩| www.35632.com-快三早上几点开始| www.381148.com-深圳体育彩票中奖| www.473754.com-福彩3d技巧学堂| www.0093.org-春秋彩票输钱了| www.nk18.com-中国竞彩网客户端| www.54348.com-3d福彩图片-| www.316201.com-体彩店老板-| www.968268.com-中国体彩电子投注单| www.869876.com-今天的3d福彩图纸| www.nn25.com-彩票在线选号器| www.43mz.com-徐州福利彩票员工| www.819797.com-刮彩票的秘诀| www.58892.cc-金冠彩票app| www.209585.com-高频彩票-| www.67853.cc-买足球彩票是赌博吗| www.037745.com-七乐彩在线选号工具| www.390759.com-快三保本打法| www.26868.cc-刮刮乐福彩自助终端| www.76vl.com-3d乐彩网摘首页| www.qj7.com-全国快三开奖| www.910855.com-篮彩比分网-| 凤凰彩票www.3479z.com| www.259722.com-彩票选号大师| www.791724.com-地方彩宁夏银川快三| www.63ct.com-怎么样才能中彩票| www.872065.com-福彩三弟跨度走势图| www.961498.com-福利彩票刮刮乐英文| E彩堂www.43818d.com| www.718382.com-彩虹七种颜色的寓意| www.821508.com-福利彩票主任是谁| www.904454.com-抚州市彩票管理中心| www.978486.com-天天好彩生肖号码| www.bd92.com-今天喜乐彩开奖结果| www.vs96.com-彩票开奖计划网站| www.438.cx-首页福乐彩| www.5262.top-彩票站营业时间时间| www.509827.com-福利彩票百家号| www.52qk.com-彩虹网秒赞-| www.365173.cc-中信彩票可靠吗| www.460799.com-米兜彩票app官网| www.567462.com-彩虹5号无人机多长| www.312908.com-时时彩后三胆码公式| www.251670.com-彩票12安卓-| www.327848.com-福彩3d实战宝典| www.106821.com-中国体育足球竞彩网| www.815027.com-快三投注开户| 爱购彩票www.355264.com| www.939025.com-58彩票老版本| www.244055.com-甘肃快三兑奖规则| www.024653.com-福彩积分卡兑换| www.102109.com-彩计划app官网| www.144908.com-中体信誉彩票平台| www.202077.com-彩票过滤软件下载| www.260772.com-黑马西安竞彩快三| www.318177.com-巨彩彩票app下载| www.370996.com-河内五分彩后三计划| www.443601.com-心脏彩超讲解| www.511848.com-大地彩票手机| www.561903.com-中彩彩票注册教程| www.42xv.com-郑州共赢彩钢扣板厂| www.66vn.com-优游彩票注册| www.838.biz-锋彩直播电视免费版| www.964111.com-快三必中方法| www.81le.com-中国福彩加盟赚钱吗|