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.235431.com-微彩娱乐app下载| www.382827.com-重生之九彩僵神| www.577351.com-青海体彩任3| www.663897.com-中彩开奖-| www.755222.com-中彩网擂台寒| www.869122.com-七星彩经-| www.973079.com-798彩票下载安装| www.bs96.com-最新的彩票缩水软件| www.wt29.com-甘肃快三图表| www.25yt.com-黑龙江福彩软件下载| www.0566.xyz-琓彩人绝杀一码| www.8150.me-爱彩彩票网合法吗| www.37193.com-好运来彩票安全不| www.89786.com-网购双色球彩票| www.060358.com-玩黑彩能报警吗| www.188902.com-大赢家彩票平台骗局| www.276393.com-新疆福彩-| www.383771.com-中国足彩比分查询| www.520174.com-国家彩票包括哪些| www.602433.com-福利彩票双色球胆拖| www.682861.com-现在最好的彩票软件| www.772905.com-时时彩厘毫模式| www.899497.com-黑彩源码-| www.972813.com-完整版比分彩客网| www.iv9.com-内蒙快三下载安装| www.rw39.com-中国彩票官网客户端| www.19eo.com-男子借钱买彩票| www.531.website新浪爱彩必发成交量| www.5379.biz-今天贵州福彩快三| www.14903.com-彩票资料网址大全| www.62700.cc-技术型彩民彩票培训| www.065846.com-私彩大平台排行榜| www.142618.com-财神8彩票网址| www.224283.com-bb快乐彩-| www.305073.com-新浪彩票投注平台| www.383396.com-怎样选彩票号码| www.610567.cc-彩票3个数-| www.691022.com-足球彩app-| www.776136.com-亿万彩票可靠吗| www.888839.com-体彩店合伙人协议| www.976851.com-河南发布彩礼标准| www.dk8.cc-168彩票网站| www.ro50.com-希腊5分彩开奖结果| www.14jf.com-福彩群英会中奖明细| www.297.red-七星彩没人买| www.4433.mobi-亿万彩票07-| www.04189.com-福利彩票旺彩网| www.52906.com-港免绿好彩-| www.000852.com-蚂蚁积分买彩票| www.072151.com-体育彩票坐庄| www.144018.com-时时彩预测家| www.303891.com-鑫亿彩真的假的| www.381754.com-彩票平推是什么意思| www.522478.com-我乐时时彩计划软件| www.597292.com-吉祥彩手机版| www.673693.com-彩绘包袱图片| www.759078.com-腾讯微彩国际| www.879957.com-内蒙古体彩中心位置| www.964022.com-竞彩开奖结果查询| 幸运彩票www.768299.com| www.kt39.com-买彩票赚钱的方法| www.k13.biz-福利彩票双色球购买| www.44ss.com-a7娱彩登录注册| www.737.vip-美国彩票收入| www.4792.biz-老式万彩吧下载| www.03980.com-十四彩怎么玩法| www.51317.cc-彩票不要用倍投| www.97241.com-彩票双色球开奖| www.065371.com-玛雅博彩官网app| www.137890.com-六福彩怎么玩| www.219394.com-福建福彩公示| www.298186.com-辽宁快三群-| www.373111.cc-免费彩金棋牌游戏| www.480081.com-时时彩买单双方法| www.565119.com-百度中国彩吧| www.638660.com-无锡体彩竞彩店分布| www.836533.com-好彩是非法的吗| www.909267.com-七星体彩中奖信息| www.974076.com-外蒙快三骗局揭秘| www.dz88.cc-福彩快三哪个平台有| www.wr37.com-可以追号的彩票平台| www.15nv.com-97彩票彩种| www.1065.cn-上诲体彩开奖| www.8904.loan-竞彩比分4串1中奖| www.44786.com-盈利彩票登录| www.91194.com-杏彩平台注册地址| www.051342.com-首页高频彩吧| www.157725.com-足彩500.w-| www.246292.com-竞彩足球比分推荐网| www.322775.com-七乐彩胆拖-| www.390963.com-怎样手机投注彩票| www.534085.com-五行预测彩票速查表| www.620101.com-釉上彩图片-| www.692519.com-6678彩票平台下| www.774424.com-虎扑体育nba彩票| www.879728.com-彩票开奖采集| www.958809.com-彩票好久开-| 中彩网www.81233hh.com| www.ep62.com-腾讯官网竞彩| www.wh49.com-体彩排三开奖号| www.14sb.com-彩票店怎么装修好| www.709.cm-王者彩票网-| www.4491.me-彩票站投资-| www.9689.net-趣彩提现不到账| www.99187.cc-大发时时彩五星玩法| www.065123.com-彩票33骗局-| www.159198.com-足彩任九奖金| www.249282.com-购彩彩票-| www.318999.com-三分时时彩是真的吗| www.387909.com-7f彩票-| www.528953.com-七彩虹官方网站| www.610111.cc-还有人买彩票| www.678604.com-足彩赔率分析技巧| www.753342.com-安装彩钢瓦-| www.860810.com-体育彩票11选3| www.922571.com-竞彩网招聘-| www.977461.com-如何开彩妆店| www.dw05.com-福彩销售终端机加盟| www.uw60.com-福彩开奖双色球兑奖| www.07cs.com-充一元送彩金| www.74pt.com-万豪彩票是真的吗| www.1297.org-私彩会不会针对人| www.9966.pw-安装七星彩排列五| www.53265.com-一起博彩票-| www.95036.com-海南结婚彩礼| www.053184.com-彩票网赚是真的假的| www.150520.com-福利彩票缴税多少| www.234081.com-宁夏体彩十一选五| www.304334.com-海南时时彩开奖查询| www.367926.com-728彩票手机检| www.455097.com-乐彩是合法的吗| www.549522.com-足彩平台哪个好| www.668864.com-十中一的彩票有哪些| www.739393.com-八彩国际童模机构| www.810477.com-官方彩16可靠吗| www.878571.com-福彩积分兑换礼品| www.977184.com-濮阳彩礼多少钱| www.cai4094.com福彩双色球开奖号码| www.jm75.com-玩快三输钱了怎么办| www.zn72.com-体彩飞鱼直选三口诀| www.22ka.com-体彩机选能中奖吗| www.921.in-临沂福彩中心电话| www.4799.net-彩虹六号直播恢复| www.9619.net-彩色的造句大全集| www.59184.com-瑞彩网开挂-| www.008521.com-腾讯彩票夹娃娃| www.069983.com-m8彩票注册邀请码| www.128773.com-福运彩票可靠吗| www.197712.com-彩八app下载安装| www.261775.cc-多赢彩票官网网址| www.383859.com-山西省体彩怎样兑奖| www.501322.com-广东体彩结果| www.563694.com-中彩加拿大28| www.625072.com-七乐彩8中4-| www.686289.com-那个高频彩玩的人多| www.759000.com-大中华彩票怎么样| www.876685.com-香港正版挂牌彩图| www.952613.com-旺彩大乐透选号| www.999149.com-彩乐汇是黑平台吗| www.cp7656.com-黑龙江快三走势图| www.ku13.com-红旗彩票app快3| www.zk49.com-关于彩票新闻| www.19ds.com-买彩票中奖的小说| www.556.pw-云南省体彩十一选五|