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.ky02.com-百盈快三预测| www.2232.me-阿狸彩票掌上助手| www.424559.com-彩经网3d遗漏统计| www.567298.com-乐彩33软件下载| www.663584.com-新浪彩票趣闻| www.761710.com-海南七星彩网站源码| www.239318.com-58福彩下载安装| www.354358.com-罗马彩票app下载| www.353629.com-亚洲博彩公司名称| www.305280.cc-七星彩19036期| www.428030.com-竞彩足球腰斩怎么| www.537235.com-明日之后发彩色字| www.hj20.com-福利彩8下载| www.86817.com-竞彩猫直播看不了| www.629663.com-周六是体彩还是福彩| www.985983.com-体育彩票站的提成| www.no73.com-购买福彩软件哪个好| www.04qd.com-彩铅不好叠加颜色| www.674674.com-财政部互联网彩票| www.924908.com-买什么彩票好| www.js8.com-皇都彩票能提现吗| www.yb14.com-世界杯足彩app| www.574533.com-移动免费彩铃| www.975574.com-体彩七星彩历史数据| www.c67.club-彩经网老旧版走势图| www.516295.com-多彩彩票网官方端口| www.75244.com-体彩刮刮乐最新票种| www.132944.com-富彩彩票是骗局吗| www.264989.com-华夏彩票骗局揭秘| www.424387.com-利民彩票网站合法吗| www.575018.com-噶甘肃快三一定牛| www.785595.com-彩票计划软件领航彩| www.281961.com-河北快三窍门| www.735554.com-体彩快乐12下载| www.672939.com-广东11选5快彩| www.775061.com-购彩助手能不能玩| www.875429.com-1分钟彩票怎么回事| 500彩票www.375477.com| www.49nh.com-彩色冰淇淋机| www.1168.cm-描写刮彩票句子| www.61174.com-新加坡福利彩票网站| www.397314.com-盈众彩票app| www.539508.com-釉上彩和釉中彩| www.1984.love-怎样买彩票能中大奖| www.8212.loan-大富彩票客服| www.34366.cc-建设银行彩票定投| www.77267.cc-各种彩票中奖率| www.058687.com-福彩3d预测第一版| www.86sj.com-彩工网讲师团崔晓龙| www.5or.com-竞彩有税吗-| www.223086.com-10分快三是真的吗| www.383000.com-彩票送礼金的app| www.610319.com-七星彩开奖排| www.793477.com-胜彩asia骗局| www.910021.com-彩报3d第一版| www.163665.com-买福彩倾家荡产| www.267531.com-彩票平刷稳定方案| www.370679.com-汪汪时时彩app| www.6653.vip-腾讯分分彩八手必中| www.719723.com-河北快三app下载| www.95505.com-足彩直播现场| www.411342.com-七彩西游记2白骨精| www.544111.com-三的彩报-| www.609377.com-九九集团时时彩| www.697234.com-体彩虚拟足球开奖| www.796902.com-竟彩官网-| www.939779.com-玩彩票大概率赚方法| www.rg.cc-天天彩票助手计划| www.ot34.com-福降天下彩吧图库| www.121851.com-刘亮的彩票-| www.251359.com-河北快三开一定牛| www.322786.com-全球盛兴彩票v1| www.713619.com-豹赢彩票官网| www.778388.com-天天彩选三开奖号码| www.872634.com-超级赛车彩票怎么玩| www.958737.com-js518全彩漫画| 博友彩www.939253.com| www.0305.org-如何选碗釉中彩| www.06310.com-福彩3d和值为7| www.72790.com-福彩开奖记录表| www.94il.com-易彩堂代理-| www.143939.com-福彩3+d走试图| www.320111.com-至尊争霸彩票app| www.439800.com-大乐透亿元大奖彩票| www.673598.com-台湾福星彩票开奖| www.823786.com-网络卖体彩合法吗| www.444741.com-手机彩票复式下载| www.552167.com-火剪彩票下载安装| www.632470.com-中国彩票平台排行榜| www.826328.com-彩票知识-| www.903525.com-星光彩票注册邀请码| www.993695.com-希腊十分彩开奖号码| www.cn60.com-北京快三开奖时间表| www.zs24.com-福利彩票派奖规则| www.039334.com-体彩投资-| www.603327.com-世界杯哪里买彩票| www.412248.com-鲤鱼立体彩铅画图片| www.511813.com-话费余额买彩票| www.570526.com-七彩云南翡翠北京| www.631616.com-彩票开奖乐和彩| www.700053.cc-魔合时时彩计划网页| www.768980.com-足彩竞猜的app| www.830576.cc-557彩票网-| www.389.red-安徽福彩电话号码| www.4889.biz-彩猫掌中宝-| www.33713.com-彩票什么时候停售| www.867183.com-v8彩app下载| www.84683.com-彩圣字谜3d汇总| www.087063.com-7125彩票app| www.69317.com-竞彩官方网站计算器| www.010237.com-彩票预-| www.078832.com-六合牛娃彩票| www.76qr.com-阿里彩票官网| www.3fl.cc-知名的高频彩平台| www.733235.com-试机号走势图彩宝网| www.490125.com-500彩神邀请码| www.945234.com-今天的湖北快三| www.196653.com-彩票开奖结果七星彩| www.307661.com-彩71彩票注册| www.828789.com-27彩票下载-| www.922750.com-彩票全讯平台| 三星娱乐www.sxyl8.com| www.001378.com-极速快三能玩吗| www.ja75.com-竞彩足球比分规则| www.d14.in-福彩3d彩票开奖| www.973992.com-彩票中奖视频| www.ca99.com-彩81app-| www.wz43.com-河南河南快三| www.047722.com-11选5彩票推算器| www.503937.com-买高频彩算投资吗| www.576493.com-快三河北和值| www.666730.com-乐彩网怎么充值| www.0459.win-福彩双色珠走势图表| www.pz27.com-彩票c6软件-| www.3959.cm-奥博彩票app| www.9980.la-西宁彩色混凝土压印| www.209338.com-快三可以赚钱吗| www.801291.com-彩票自动终端机| www.997857.cc-福彩3d出对子规律| www.59937.cc-百乐彩娱乐平台| www.895989.com-福彩快3的玩法介绍| www.963357.com-七乐彩31有奖吗| JJ彩票www.33063.cc| www.220460.com-兼职中彩在线靠谱吗| www.88976.cc-官方认可的彩票软件| www.850759.com-体育彩票号码机选| www.295523.com-体育彩票快三奖励| www.496543.com-917彩票平台下载| www.654906.com-时时彩单式复式区别| www.869937.com-彩彩票开奖查询| www.48cu.com-体彩p3图谜图库| www.688098.com-九州彩票的邀请码| www.292971.com-彩票3d预测推荐| www.43fn.com-彩色耐磨地坪多少钱| www.441384.com-七星彩梦册查奖| www.0659.vip-香港快乐5分彩| www.21783.cc-彩票大乐透专家预测| www.xn48.com-快三一共多少个组合| www.84tu.com-北京七星彩开奖| www.6854.cn-欧盟无嘴好彩| www.54zz.com-乾坤彩票-| www.5962.xyz-19052期体彩| www.761641.com-山东群英会彩票| www.923729.com-秒速时时彩官方的吗|