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.13982.com-香港皇家时时彩| www.744553.com-詹天佑福彩3d| www.89ji.com-下载京彩钱包| www.302918.com-澳门彩票平台大全| www.419222.com-风落中彩大乐透预测| www.544881.com-河北快三开奖结杲| www.133774.com-好彩高手论公式| www.233745.com-福彩3d组选走势图| www.982.date-体彩七星彩中五个数| www.7345.pw-彩虹6号难-| www.318954.com-南国七星彩图规论坛| www.445424.com-时时彩缩水过滤工具| www.351480.com-快三投注合买平台| www.339379.com-生彩宝手机版下载| www.947640.com-买彩票不亏法| 好彩头彩票www.90305d.com| www.106865.com-瑞彩祥云苹果版网| www.070860.com-下载一定牛江苏快三| www.561461.com-306抢红包彩票| www.47073.com-秒速时时彩精准计划| www.258429.com-彩票定位胆技巧| www.398569.com-首存赠送100彩金| www.608002.com-爱彩乐咋看-| www.61197.com-苹果手机版彩票| www.877021.com-万豪福彩助手| www.980004.com-678111彩票网| www.hy43.com-彩票大底什么意思| www.09au.com-戒彩票经验总结| www.56mc.cc-天天中彩票怎么领奖| www.10604.cc-198彩票注册| www.3237.com-阳光彩票注册登录| www.009470.com-234彩票官网下载| www.cc23.cc-爱彩乐彩票湖北快三| www.253275.com-彩票456-| www.441422.com-彩钢瓦房屋-| www.181811.com-吉林快三玩法技巧| www.948925.com-中国体彩网e球彩| www.76kd.com-中国彩八三b| www.1966.club-云购彩票注册| www.262225.com-福彩快3在线投注| www.48kd.com-星彩的意思-| www.48pj.cc-三国杀张星彩厉害吗| www.0377.pw-彩票106-| www.8042.loan-简单水彩画画| www.8296.top-玩易彩-| www.32924.com-2月11日彩票调整| www.520493.com-m5彩票平台-| www.712577.com-七乐彩在线模拟摇奖| www.23ac.com-178彩票网邀请码| www.183271.com-福彩官网-| 大赢家彩票平台www.351731.com| www.ql57.com-乐彩网福彩3d首| www.1an.com-彩宝彩票可信吗| www.511957.com-彩铅的简单画法| www.177119.com-三分快三下载| www.207435.com-快三彩票软件哪个好| www.1473.top-彩铅风景简笔画| www.181869.com-038彩票app-| www.365495.cc-香港即時開彩| www.531197.com-学彩铅有什么用| www.653502.com-福彩3八卦图| www.0311.live-彩虹的约定歌曲儿歌| www.468056.com-广州福利彩票申办| www.5664.pw-看图买生肖彩票| www.586036.com-发梦中彩票二等奖| www.754948.com-新华彩票公司| www.887208.com-11选5购彩微信群| www.52937.cc-新浪篮彩预测| www.yo49.com-体彩竞彩哪里可以买| www.99ss.com-彩票双色球历史查询| www.dg29.com-福利彩票时时彩下载| www.322943.com-印尼三分彩开奖号码| www.432520.com-全复式彩票多少钱| www.608283.com-彩票背后的秘密| www.356324.com-华阳彩票提现还没到| www.0104.org-哪些东西是彩色的| www.165729.com-旺彩3d杀号码定胆| www.81665.com-福彩3d几点开奖| www.48vs.com-哪种彩票公正| www.188217.com-江苏爱彩乐快三| www.876540.com-大彩网3d走势图| www.115687.com-手机彩票代购| www.547111.com-凤凰彩票代理政策| www.556041.com-福彩快三中心电话| www.382098.com-男子借钱买彩票| www.729.red-猜大小彩票不能玩| www.3198.net-体彩7星开奖号| www.99367.com-竞彩官网开奖| www.385309.com-彩票大平台抢红包| www.565053.com-3d胆码彩家网| www.58697.cc-鸿运5分彩-| www.404244.com-彩铅手绘卡通狗| www.cp661.com-大发快三官网| www.199412.com-乐彩太湖字迷网| www.381632.com-个人卖私彩坐牢吗| www.149338.com-彩票网址-| www.556752.com-新浪彩票动态澳盘| www.529228.com-热门彩票开奖查询| www.185988.com-云南时时彩开奖结果| www.64.me-福彩高管贪污| www.931978.com-排3彩宝网试机号| www.4yk.com-马来西亚彩云阁酒店| www.339464.com-彩78彩票软件下载| www.431462.com-时时彩四星手机缩水| www.655339.com-福星彩app软件| www.772780.com-发信息领彩金| www.875500.com-老版腾龙时时彩做号| www.962154.com-五分彩可以用公式来| www.ut2.com-中国手机彩票网站| www.505808.com-手机玩黑彩犯法吗| www.302664.com-977彩票官方| www.644321.com-玩黑彩-| www.3227.com-燕赵风采福利彩票| www.308018.com-彩票时时彩稳赚技巧| www.sk50.com-腾讯分分彩后二公式| www.08va.com-体彩排列三出号走势| www.504811.com-座谈来彩排-| www.630779.com-优彩彩票网站| www.947891.com-网上正规购彩平台| 红鹰彩票www.hy6936.com| www.rk9.com-红牛彩票网赚真假| www.pu45.com-a1彩票-| www.271237.com-苹果八亿彩app| www.014663.com-七星彩啥是对数| www.869723.com-快乐彩票用户登录| www.775256.com-七星彩开奖结果七| www.44212.com-如何看彩票票样密码| www.562686.com-新加坡时时彩合法吗| www.632390.com-现在怎么买彩票| www.692173.com-彩乐乐网站倒闭了吗| www.761527.com-钟嘉欣好彩妹| www.858425.com-三彩丽雪官方旗舰店| www.906056.com-好看彩色的东西| www.961328.com-a·93彩票-| 凤凰彩票www.3479s.com| www.355672.com-竞彩中奖缴税| www.144987.com-竞彩延期官网首页| www.242577.com-168彩票网站下载| www.330217.com-七天网的彩票靠谱吗| www.443667.com-完美彩票1app| www.533204.com-七星彩中奖最高纪录| 彩82www.c9332.com| www.440535.com-709彩票官网| www.735177.com-500彩票网网站| www.732019.com-胜负彩模拟投注| www.909508.com-体彩19054开奖| www.991389.com-彩吧vip安全吗| www.6lm.com-吉利彩票正规不| www.af41.com-手机手机彩票123| www.wc60.com-内蒙古快三值| www.08hq.com-爱购彩票真实平台| www.327790.com-国彩网投彩票可靠吗| www.873794.com-晋城福利彩票转让| www.31899.cc-唯彩旧版下载| www.76376.cc-福彩三d天吉网| www.037750.com-七乐彩缩水过滤软件| www.102511.com-5分彩开奖走势| www.iu34.com-体育彩票6+1规则| www.272539.com-个性彩票宣传语| www.353222.com-668彩票网平台| www.sg37.com-五分时时彩下载| www.347863.com-众乐快三在线计划| www.169065.com-河南快三彩经网| www.443227.com-双色球维彩视频宝典|