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.020894.com-808七星彩票论坛| www.245388.com-易彩堂app登录| www.379957.com-体彩购买-| www.507952.com-二元福彩三地走势图| www.613258.com-高频彩票的危害| www.pq04.com-众彩网北京赛车| www.221481.com-彩90彩票登录| www.8ln.com-凤凰极速快三网站| www.863930.com-福彩双色球往期开奖| www.27782.cc-福利彩票了3个号| www.583236.com-3d彩经网开机| www.694998.com-竞彩返还率-| www.ej69.com-杭州快乐彩中奖方法| www.rl21.com-深圳福彩22选1| www.732445.com-江苏体彩唯一官网| www.tz40.com-彩票里的长龙怎么玩| www.19033.com-足彩胜负平对阵表| www.652931.com-彩票九苹果下载软件| www.740338.com-福彩天下是正规的吗| www.821911.com-成都福彩店转让信息| www.895567.com-彩票合买系统在哪找| www.973910.com-新2彩论坛-| www.cai8066.com快三开奖查询武汉| www.2371.net-七彩蛋电影网| www.or89.com-北京快三最长大小| 凤凰彩票www.77802s.com| www.zp32.com-福彩3d电子彩报| www.306197.com-立彩助手-| www.802049.com-9928彩票平台| www.753656.com-彩票包赔骗局| www.z97.cc-七乐彩新浪尾数走势| www.357307.com-中了彩票让父母领| www.112346.com-98时时彩登录平台| www.222983.com-腾讯分分彩玩法心得| www.875283.com-彩票坊合法吗| www.30117.cc-彩8娱乐下载安装| www.761603.com-中国体育彩票的玩法| www.873495.com-c38彩com-| www.982465.com-辉腾团队鸿彩平台| www.ag97.com-123彩票走势图| www.ua71.com-快三一倍多少钱| www.990125.com-搜索彩票88| www.fn04.com-淘彩票大发快三| www.yp21.com-大马4d彩票-| www.781497.com-马来西亚福利乐彩| www.801228.com-6a彩票app-| www.940402.com-七星彩开奖第48期| 彩之家www.00czj.com| www.206337.com-重庆快三走势图| www.95447.com-体彩彩票公益金| www.ox68.com-福彩3d中奖绝技| www.62.biz-80彩票可以提现吗| www.265189.com-网易要闻彩票预测| www.875034.com-彩票坊是正规的吗| www.954904.com-跑马彩票计划ap| 七星乐www.535666e.com| www.586969.com-天天彩骗局揭秘| www.687638.com-天天中彩票双色球| www.687094.com-我彩票中奖了| www.29663.cc-3d彩民乐钱树图库| www.016223.com-刮彩票中大奖的技巧| www.32645.com-欧冠足彩-| www.95679.com-福彩2元刮刮乐| www.032769.com-诸葛智彩电脑版| www.024716.com-竞彩奖项-| www.639307.com-体彩机器转让多少钱| www.8515.top-怎么投诉黑彩网站| www.715805.com-双色球新彩吧预测| www.fv01.com-soul彩票托-| www.ic23.com-彩票微助手-| www.739947.com-万博彩票是骗局吗| www.7415.cc-色彩斑斓的黑| 福彩www.15355j.com| www.ji01.com-发彩-| www.180549.com-中彩啦app下载| www.444633.com-云朵福彩3d杀码| www.522505.com-分分彩龙虎精准计划| www.30520.cc-京东时时彩-| www.49137.com-旭彩美缝剂质量| www.763885.com-福彩3d老虎图彩报| www.958003.com-七星彩预测单双头| www.fn80.com-大发快3彩票平台| www.916266.com-篮球胜负彩票规则| www.791884.com-足彩8串1的概率| www.899033.com-免费领彩金快三| www.971256.com-福彩赛车怎么玩法| 亿发彩票www.802533.com| www.rj85.com-大运河彩票怎么样| www.084010.com-探探彩票托是转职吗| www.071767.com-中国彩票发展趋势| www.350670.com-所有9号彩票网址| www.482086.com-福彩3d表势图| www.591005.com-徐州彩票中奖| www.r60.cn-快钱彩票有人赢钱吗| www.129.biz-请播放彩虹的约定| www.513907.com-竞彩总进球数技巧| www.374821.com-怎样注册网上买彩| www.625925.com-秀平彩票-| www.327517.com-彩票图3d-| www.690351.com-19047期胜负彩| www.773861.com-博彩官方彩票网| www.849355.com-三分时时彩公式技巧| www.939728.com-快速赚钱的方法彩票| www.984196.com-今日太湖字谜多彩网| www.c8.me-福彩3d字谜图谜| www.516411.com-中发彩票是黑平台| www.610679.com-体彩超值8规则| www.zt49.cc-时彩怎么容易赚钱| www.2596.cc-时时彩网站诈骗案| www.7820.org-3d彩票奖金是多少| www.47op.com-南宁体育彩票中心| www.698077.com-杭州市体彩兑奖地址| www.775724.com-彩票网站源码下载云| www.842780.com-福彩5元刮刮乐类型| www.932552.com-中彩论坛字谜| www.979868.com-河南快三昨天开奖| www.cp7808.com-快三秒奶茶-| www.qd14.com-日本彩票销售下降| www.74xr.com-谁用过彩票过滤大师| www.169255.com-长春福彩快三走势图| www.903959.com-彩票游戏出租| www.969285.com-天天中彩票犯法吗| 大赢家彩票网www.339351.com| www.36876.com-快三qq群导师| www.325435.com-新万彩吧资料| www.026453.com-双色球免费易彩预测| www.101874.com-足彩任选九场奖金| www.262016.com-福彩开奖结果是| www.563105.com-正彩文具官网| www.632151.com-竞彩收米图-| www.701580.com-网上买彩票的骗局| www.773116.com-复式彩票中奖5元| www.851978.com-特彩吧高手网天下齐| www.913900.com-彩之家官方旗舰店| www.963187.com-河南南阳彩礼多少钱| 818合彩www.www.9889hc.com| www.gm32.com-江苏快三开奖有假吗| www.a91.cn-如何看快三走势图| www.65ho.com-丫头说彩福彩体彩| www.527753.com-时时彩定和值技巧| www.627522.com-体彩排三图谜字谜| www.682230.com-球彩app-| www.752976.com-彩神彩票网专业版| www.825816.com-云南快三开结果| www.898662.com-时时彩挂机软件骗局| www.970295.com-七彩球彩票-| www.ec03.com-百姓彩票是正规的吗| www.122439.com-乐彩vip官方| www.az18.com-快三赢钱笨方法| www.b91.club-678cc赢彩彩票| www.429062.com-亿宝彩票可以玩吗| www.554556.com-七天彩合法吗| www.886471.com-彩票合买网站骗局| www.1237.pw-彩神争霸8网站| www.98lk.com-东莞体彩网点| www.39992.cc-彩票投注站利润分析| www.548265.com-快三和值怎样买稳赢| www.z06.club-彩神三码-| www.362820.com-彩虹像什么一年级| 网易彩票www.177534.com| www.330628.com-掌上购彩软件下载| www.015652.com-七星彩怎么中奖法| www.24383.com-唯美古风人物彩铅画| www.47983.com-下载福彩群英会|