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.741881.com-湖北快三论坛群| www.971401.com-体彩排列三开奖公告| www.jb47.com-中国足彩网赛事中心| www.799928.com-大发快三开奖现场| www.889753.com-体彩排列三今日独胆| www.969652.com-快三购买技巧| 幸运彩票www.669268.com| www.023762.com-r8国际彩票骗局| www.131781.com-河南西平结婚彩礼| www.30mc.com-中国体彩啥时候开奖| www.7098.pw-七彩阳光一-| www.524940.com-腾讯分分彩经验贴| www.654541.com-福彩3d轨迹-| www.627661.com-分分彩三期必中计划| www.290597.com-澳门快三官方网站| www.887477.com-下彩网怎么用不了了| www.990602.com-彩750彩票-| www.bs82.com-彩票榜有几个软件| www.te45.com-时时彩规则及奖金| www.13ml.cc-全民竞猜彩票| www.101838.com-新浪体育彩票直播| www.pl2.com-找吉林福彩快三昨天| www.321038.com-新3d彩票官网| www.663465.com-体彩综合版-| www.781014.com-长春彩票销售员招聘| www.16195.com-竞彩资讯中心| www.232571.com-玩彩票赚钱是真的吗| www.61449.com-金博在线彩票| www.324795.com-吉隆坡博彩合法吗| www.450739.com-梦见彩票数字好不好| www.50dt.com-易彩平台客服| www.5369.cm-在淘宝怎么买彩票| www.413184.com-御都彩票安卓版下载| www.556405.com-求幸运快三计划软件| www.668149.com-中国福彩幕后老板| www.827831.com-彩民彩票怎么提现| www.941878.com-彩票代理如何拉人| www.wa46.com-昨天足球彩票胜负| www.4716.biz-安全信誉好的彩票网| www.ft12.com-中国福彩有五分彩吗| www.156286.com-重庆实时彩开奖视频| www.920318.com-鸿彩骗局-| www.987418.com-国家合法的彩票平台| www.fi53.com-代玩彩票拿佣金| www.70iy.com-高频彩不要玩| www.18wo.com-七乐彩什么好| www.2785.vip-南方双彩华仔双胆| www.17142.com-下载山东省福彩| www.96225.cc-掌中互娱彩票| www.434808.com-江西彩票事件| www.432001.com-彩66彩票登录网站| www.582167.com-头奖彩票不能登录| www.4535.top-七星彩是几位| www.198005.com-兰州快三开奖号码| www.313999.cc-每日足彩稳胆推荐| www.13wb.com-天天有好彩玄机图| www.4246.xyz-有诚信的彩票程序| www.3730.la-领航彩票软件官网| www.022538.com-星彩网彩票大赢家| www.0573.pro-福彩布衣老汉图| www.029964.com-彩票随机原理| www.320725.com-中彩乐网站-| www.666882.com-乐彩1602-| www.147367.com-各种彩票开奖号码| www.039093.com-爱投彩票怎么兑奖| www.46rh.com-体彩店转让信息| www.5358.xyz-竞彩足球胜平规则| www.303018.com-福彩3d大奖-| www.836286.com-彩客网竞彩混合过关| www.972766.com-迪士尼彩票为人类建| www.oc47.com-篮球体彩-| www.858569.com-竞彩可以胆拖出票吗| www.9130.in-彩壹万平台手机版| www.94zy.com-足彩无风险套利| www.4598.biz-彩票超过一万兑奖| www.588748.com-新浪彩网开奖号| www.815685.com-石家庄福彩中心地址| www.368923.com-福建彩票摇奖机| www.91eh.com-彩票有哪些好的团队| www.5709.me-三彩陶器-| www.226688.cc-易彩票下载苹果| www.58229.cc-下载彩乐图-| www.025607.com-陕西省福彩兑奖流程| www.35tw.com-多彩网辽宁12选5| www.53771.cc-盈利多多秒速时时彩| www.014833.com-体彩七星彩口诀| www.2600.in-惠盈竞彩app地址| www.653922.com-ll彩票怎么玩| www.816665.com-河南福彩中奖新闻| www.922660.com-南阳彩铃制作| 500彩票网www.97655z.com| www.yp40.com-时时彩网站下载| www.593790.com-七彩汇娱乐是真的吗| www.081810.com-恒博彩票官网| www.547025.com-澳客彩店骗局| www.359925.com-7星彩怎么买| www.813364.com-网上兼职代买彩票| www.941934.com-重庆分分彩开奖号码| 名门彩www.33997j.com| www.333057.com-怎么样买彩票中大奖| www.505308.com-网易彩票500期| www.613141.com-航天彩虹股票的价钱| www.273859.com-希望手游三分快三| www.001521.com-釉彩大瓶的成分| www.101617.com-彩票aqq下载| www.589363.com-双彩论坛字谜排列三| www.647767.com-陶宝买彩票-| 中国福利彩票www.33588g.com| www.7112.cm-彩票93-| www.6848.net-乐彩网三地开奖结果| www.35959.com-盛元彩票网-| www.175775.com-北京快三app| www.271772.com-最新好彩一-| www.354820.com-买彩票真能中奖吗| www.427492.com-篮球竞彩结果| www.517754.com-南方双彩官方| www.581593.com-808彩票app-| www.650619.com-玩彩虹伞音乐| www.704896.com-时时彩个位杀号计划| www.777900.com-香港五分彩合法吗| www.883389.com-pc彩票app-| www.949289.com-香港电脑彩八肖图| 赢彩吧www.c9662.com| www.074735.com-彩富网免资料大全香| www.372476.com-7彩娱乐app下载| www.557082.com-简单水彩花卉图片| www.648666.com-十选五彩票规则介绍| www.47eu.com-3d2元彩票网| www.895.red-简单樱花树彩铅画法| www.985401.com-关小刀足彩任九推荐| www.162310.com-下彩网app官网| www.312099.com-红牛彩票下载| www.484537.com-福彩有几种类型| www.08896.com-广东电脑福利彩票| www.44176.com-怎么看彩票的票花| www.03700.cc-天天中彩怎么提款| www.021002.com-彩票公众号老刘说彩| www.mu11.com-官方购彩app| www.83rv.com-彩票亭转让-| www.3988.cn-东北结婚有彩礼吗| www.42440.com-709彩票多少年了| www.962996.com-体彩大乐透机彩乐乐| 彩71www.915422.com| www.799899.com-彩票属于夫妻共有吗| www.293967.com-福彩十选五是真是假| www.635789.com-正规时时彩投注官网| www.45948.com-澳客彩票网电脑板| www.063590.com-帮人家卖彩票犯法吗| www.679196.com-买彩票亏钱-| www.803806.com-彩中彩平台下载地址| www.42ci.com-七彩球玩具-| www.ot59.com-彩票新规定-| www.295999.cc-福彩3d玩法规则v| www.33631.cc-专家说彩网-| www.65495.com-炫彩官网-| 大赢家彩票www.5086e.com| www.884990.com-宇宙彩票app下载| www.aq1.cc-江苏快三同号推荐| www.qy74.com-分分彩后二最牛算法| www.675188.com-怎么登陆乐游彩票网| www.770635.com-七彩野山鸡养殖| www.879058.com-百盈快三官网app| www.946539.com-首存送彩金彩票平台| www.626356.com-小站宝彩票安卓下载|