QQ客服
当前位置 : 首页 > 代码 > 网页特效 > 导航菜单 > jQuery在线教育网页顶部下拉分类导航菜单代码

原创商用 jQuery在线教育网页顶部下拉分类导航菜单代码

jQuery制作在线教育课程网站下拉分类导航,页面滚动固定顶部导航菜单代码。
分享到微信朋友圈
X
[声明]该素材是本站付费买断的作品代码,享受著作权?;?,未经允许请勿转载,否则追究相应的法律责任。

使用方法:

1、head引入css文件

<link rel="stylesheet" href="statics/css/style.css" />

2、head引入js文件

<script src="statics/js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>

3、body引入HTML代码

<div id="wrapper">

	<div id="nav-header">
		<div class="header">
			<h1>
				<a href="javascript:;" class="logo">
					<img src="statics/images/logo.png" width="100"/>
				</a>
			</h1>
			<nav style="width:490px;">
				<ul>
					<li>
						<a href="javascript:;" class="home">首页</a>
					</li>
					<li class="careerpath">
						<a href="javascript:;">职业</a><i class="slide-icon"></i>
						<div class="zhiye-submenu slide-submeu">
							<strong>前端</strong>
							<a href="javascript:;"><i class="web-icon"></i>Web前端工程师</a>
							<a href="javascript:;"><i class="wx-icon"></i>微信小程序</a>
							<strong>移动端</strong>
							<a href="javascript:;"><i class="android-icon"></i>Android工程师</a>
							<a href="javascript:;"><i class="ios-icon"></i>iOS工程师</a>
							<strong>后端</strong>
							<a href="javascript:;"><i class="python-icon"></i>Python工程师</a>
							<a href="javascript:;"><i class="php-icon"></i>PHP工程师</a>
							<a href="javascript:;"><i class="golang-icon"></i>Golang工程师</a>
							<strong>大数据</strong>
							<a href="javascript:;"><i class="data-icon"></i>大数据平台研发工程师</a>
							<strong>人工智能</strong>
							<a href="javascript:;"><i class="mlearning-icon"></i>机器学习工程师</a>
							<strong>区块链</strong>
							<a href="javascript:;"><i class="yw-icon"></i>区块链工程师</a>
						</div>
					</li>
					<li>
						<a href="javascript:;">课程</a><i class="slide-icon"></i>
						<div class="slide-submeu">
							<a href="javascript:;">课程库</a>
							<a href="javascript:;">职业路径</a>
							<a href="javascript:;">知识体系图</a>
							<a href="javascript:;">系列课程</a>
						</div>
					</li>
					<li>
						<a href="javascript:;">企业</a><i class="slide-icon"></i>
						<div class="slide-submeu qy-box">
							<a href="javascript:;"><i class="wr-icon"></i>微软人工智能 </a>
							<a href="javascript:;"><i class="baidu-icon"></i>百度AI图像技术课</a>
							<a href="javascript:;"><i class="aws-icon"></i>AWS云计算</a>
							<a href="javascript:;"><i class="txy-icon"></i>腾讯云课程专区</a>
							<a href="javascript:;"><i class="gt-icon"></i>Qualcomm公开课 </a>
						</div>
					</li>
					<li>
						<a href="javascript:;">社区</a><i class="slide-icon"></i>
						<div class="slide-submeu">
							<a href="javascript:;">Wiki</a>
							<a href="javascript:;">技术问答</a>
							<a href="javascript:;">社群</a>
							<a href="javascript:;">资料下载</a>
						</div>

					</li>
				</ul>
			</nav>
			<div class="search">
				<input class="searchinput" id="searchinput" placeholder="搜索课程、问答或Wiki" />
				<span class="search-icon" id="search-bottom"></span>
				<div class="search-result">
				</div>
			</div>
			<div class="nav-other" id="nav-other">
				<span class="userinfo-notlogin">
			   <a href="javascript:;">登录</a><i></i><a href="javascript:;">注册</a>
			   </span>
			</div>
		</div>
	</div>
	
	<div style="height: 1800px;width: 100%;">
		<!--高度填充可以删除-->
	</div>
	
</div>

<script>
	//导航滚动置顶
	$(function(){
		var navHeight = $('#nav-header').height();
		$(document).scroll(function(){
			$(window).scrollTop()>=navHeight?$('#nav-header').addClass('fixed'):$('#nav-header').removeClass('fixed');
		})
	})
</script>
[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系客服QQ:2447402004给予处理。
举报×
举报原因:

相关代码

二维码
意见反馈
×
×

注册

QQ注册 立即下载 新浪注册 立即下载

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了
畅彩 www.299340.com-玩彩是什么意思| www.10207.com-9亿彩票网址| www.96175.cc-o1彩票北京pk十| www.kp2.com-安徽快三下载苹果| 天下彩www.623660.com| www.wz82.cc-七星彩头尾数预测| www.35oh.com-足球彩票几点能买| www.1226.xyz-170彩票平台| www.6692.cm-山东体彩订票网| www.35935.cc-彩九经典梯形彩票| www.83944.com-亳州天价彩礼事件| www.377222.com-彩树歌-| www.341368.com-3d彩开奖-| www.355352.com-智博彩票网的网址| www.495703.com-利记博彩哪个国家的| www.610208.com-永利彩票网信得过吗| www.711210.com-手机刷彩靠谱吗| www.813726.com-123彩图-| www.6173.pw-彩钢板价格-| www.24512.cc-k8彩票55kk台| www.019611.com-山东体彩十一夺金| www.108726.com-七星彩开奖历史数据| www.58bs.com-uu快三和大发快三| www.400813.com-87彩店跟单靠谱吗| www.618717.com-广东体彩走势分析师| www.717935.com-大星彩票走势图福彩| www.802274.com-吃鸡精彩视频| www.876723.com-玩重庆时彩输钱的人| www.cai001.cc-上海快三走势图开奖| www.lv85.com-足彩app-| www.14he.com-亚博彩票是什么软件| www.114170.com-重庆三分彩开奖查询| www.100866.com-乐彩客彩票app| www.202503.com-重庆贵族快三开奖图| www.423289.com-2017彩票图片| www.553081.com-上海中国体育彩票网| www.638657.com-西安市竞彩足球| www.8317.shop-彩票赢钱是好事吗| www.861385.com-五分彩破解器| www.766139.com-风采彩票软件| www.bx41.com-全国快三走势| www.464700.com-足彩单双什么意思| www.766827.com-凤凰国际时时彩| www.114521.com-富贵彩官网-| www.914853.com-淘彩可靠吗-| www.145104.com-玩彩票刷流水赚钱| www.556018.com-体育彩票是全国的吗| www.809588.com-众乐彩官网下载| www.896278.com-瑞彩-| www.968324.com-中国彩票领导作假| www.zx.com-彩票11选五-| www.891581.com-洪荒之九彩凤凰| www.999905.com-彩票计划套路| www.ki38.com-内蒙古福彩官方网站| www.05kd.com-彩铅画工具有哪些| www.104.me-彩票中奖后兑奖流程| www.3359.cn-如何选彩票-| www.8527.org-竞彩足球的销售时间| www.4925.cc-吉祥福彩-| www.cp038.cc-彩票大小单双骗局| www.853957.com-微信时时彩怎么坐庄| www.f80.cc-海南私彩怎么算中奖| www.xf23.com-中华彩票网主页| www.34ap.com-七星彩下期预测头尾| www.810.bid-体育彩票浙江6+1| www.564466.com-黑客破解极速时时彩| www.651981.com-一分快三服务器免费| www.721599.com-足彩单场胜负彩| www.814288.com-红玺国际网上彩票| www.879772.com-西安市福彩中心地址| www.977335.com-福彩3d技术-| www.cai4111.com内蒙快三跨度走势| www.ij36.com-193彩票-| 凤凰彩票www.77803h.com| www.000138.cc-天津好彩打印官网| www.078508.com-盈盈彩合法吗| www.460404.com-凤凰彩票怎样能赢钱| www.21su.com-状元彩票网app| www.144512.com-五分快三助手下载| www.254962.com-正规彩票送彩金| www.978660.com-c彩票开奖查询| www.dz5.cc-3分钟一期什么彩票| www.668955.com-美狮彩票网址| www.wd85.com-彩票开奖号-| www.975475.com-蚂蚁彩票怎么样| www.25391.com-彩票胆组什么意思| www.326975.com-浙江快乐彩助手下载| www.454744.com-排行前十博彩公司| www.587127.com-福彩3d表格图片| www.69364.com-韩国彩票预测| www.066660.com-网络彩票危害| www.012933.com-快赢网快三推荐| www.73324.com-福彩双色球彩票贴吧| www.096.site-快三和值单式投注| www.993331.com-足彩怎么分析| www.da19.com-彩票争霸app| www.205949.com-棒棒彩票怎样诈骗的| www.311766.com-福彩3d彩图-| www.tq98.com-安徽快三时间差漏洞| www.936158.com-彩票反水什么意思| 天玺彩票www.568380.com| www.lh11.cc-今日中彩是骗局吗| www.099796.com-彩78在哪里下载| www.82528.cc-网上彩票怎么停售了| www.936.in-足球胜负彩玩法介绍| www.51877.com-辽宁唯博彩票信息网| www.1570.wang-广东七星彩中奖规则| www.29bg.com-足彩6场5关-| www.97eo.com-博又彩官方-| www.7865.cm-足彩彩票贴吧| www.357140.com-体彩福彩门头样板| www.060193.com-天天彩票网开奖结果| www.595812.com-男子赊账买彩票| www.738036.com-下载5百万彩票| www.380361.com-福彩3d返奖率报表| www.72423.com-山东青岛好彩快三| www.277666.com-魔方彩票可靠吗| www.882947.com-彩678可以挣钱吗| www.83xm.com-中国福利彩票安卓| www.4642.me-彩票店会亏本么| www.517714.com-福利彩结果-| www.54lg.com-梅春的彩票专栏| www.3000.gg-幸运彩票邀请码| www.399379.com-福彩双色球开奖大全| www.687730.com-彩神通苹果手机版| www.005145.com-江苏快三跨度表| www.673079.com-买高频彩输破产| www.770140.com-好彩投app靠谱吗| www.837901.com-岩棉彩钢板房| www.28192.cc-美国超级彩票玩法| www.397533.com-飞来福彩吧微信加入| www.418831.com-明木雕彩绘龙女立像| www.034516.com-nba体彩预测| www.5031.com-彩票几点截止| www.45ac.com-做彩票代理-| www.879823.com-彩票幸运飞艇聊天室| www.960887.com-七乐彩查询-| www.cp975.cc-买快三神器-| www.868244.com-uk彩骗局-| www.670065.com-海南彩票中心网站| www.103323.com-竟彩比分新浪| www.95gw.com-多彩投失败项目| www.5810.com-竞彩过关对照表| www.010.press-亿彩堂网页版| www.107191.com-博彩娱乐导航网址| www.211424.com-福彩3d的玩法规则| www.595918.com-邢台福彩网-| www.699929.cc-彩票领奖遇到刁难| www.766089.com-重庆时时彩乐彩图表| www.83ug.com-信彩人工计划app| www.6563.cc-福彩3d怎么解码| www.l33.me-8彩彩票-| www.xz94.com-吉祥彩票靠谱吗| www.733858.com-福利彩票隔奖| www.nw28.com-福彩快三线上平台| www.576800.com-天天彩票银行卡解绑| www.639240.com-南通体彩福彩店转让| www.688589.com-105彩票最新版本| www.751260.com-彩票网上兑奖| www.798886.com-足彩让球胜平负查询| www.852444.com-杭州福彩中心在哪里| www.903254.com-pk彩吧用户登录| www.952155.com-新浪分分彩开奖结果| www.993600.com-足彩在哪里兑奖|