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.113412.com-元红绿彩拍卖记录| www.318641.com-外国人跳快三| www.455569.com-彩票输了两万不甘心| www.589688.com-七星彩走势图规律图| www.734807.com-彩色沥青一立方价位| www.902753.com-网上赚钱快三| www.cai567.cc-福建今日快三| www.468268.com-虎门福彩印刷| www.883819.com-博瑞彩票快三| www.km79.com-彩5彩票-| www.86860.com-快乐彩12选5结果| www.254459.com-好彩网靠谱吗| www.5543.vip-万彩吧跑狗玄机图| www.21623.cc-加网友教彩票| www.814827.com-5星彩开奖结果| www.933310.com-彩票开奖中国彩吧网| www.cai172.com-江西快三开奖| www.752277.com-体彩大乐透分析软件| www.mh9.com-吉林省体彩中心电话| www.101192.com-一分快三开奖软件| www.569582.com-彩票线上购买模式| www.700948.com-彩票开奖情况一| www.793863.com-交友博彩骗局| www.902937.com-彩票平台制作怎样做| 500彩票www.50054z.com| www.689752.com-444彩票-| www.99837.cc-澳彩网登录-| www.219002.com-彩票刷负盈利技巧| www.581699.com-芒果彩票app| www.757486.com-福建省福利彩栗网| www.99304.com-时时彩盈利计算| www.290368.com-通辽体彩中心地址| www.ug64.com-国外私彩平台有哪些| www.35zq.com-七星彩近的200期| www.90298.cc-福彩太湖诗汇总| www.069640.com-神彩彩票是不是骗局| www.149975.com-掌中彩一福利彩票| www.221830.com-一分钟一期彩票| www.301301.cc-今日湖北快三预测| www.651977.com-彩票巨奖排行| www.2489.cc-678彩票官网下载| www.8622.com-福彩彩票机子说明书| www.905291.com-高频彩票绝对赚钱| www.974626.com-南京众彩水果价格表| www.cp3550.com-大发快三破解器| www.wh36.com-送18元彩票-| www.241099.com-简单彩铅画小清新画| www.135.website看到彩虹有什么寓意| www.916208.com-私彩什么平台靠谱| 百姓彩票www.bxcp3.com| www.343940.com-福彩3d杀跨度网| www.94433.cc-nba竞彩交流群| www.3026.biz-金祥彩票注册| www.104738.com-牛牛网彩票-| www.930042.com-158彩票人工计划| www.20980.com-超级彩票干嘛的| www.862816.com-当天全部彩票开奖| www.956848.com-金利彩票是怎么回事| www.bz76.com-彩票甘肃快3开奖号| www.72ud.com-360彩票官网下载| www.4250.top-七彩无码链接| www.423636.com-三国杀张星彩多少钱| www.758202.com-高盛官网彩票| www.947347.com-广州彩票软件开发| 顶级娱乐www.94238.com| 风之彩www.44fzc.com| www.32uz.com-v8彩官方网-| www.844437.com-石家庄彩票弃奖| www.386867.com-彩天下下载-| www.901906.com-公益彩票网官方端口| www.95iz.com-济南彩票店转让| www.442437.com-福彩和差表-| www.603195.com-双色球快三多少钱| www.qh99.com-山东福彩23选5| www.223336.com-至尊彩一分快3| 600彩票www.336766.com| www.832027.com-七星彩选摇号吗| www.631582.com-2018年广东彩王| www.800686.com-快3是福利彩票吗| www.915261.com-网上哪能买彩票| 彩票驿站www.2350x.com| www.vv24.com-彩票牛人-| www.837822.com-彩票兑奖期-| www.09786.com-5o5oo万彩票网| www.81066.com-燕赵福彩20选5| www.125401.com-彩天地app-| www.505805.com-时时彩心态-| www.815082.com-中国福利彩票排列七| www.392196.com-足彩篮球-| www.548622.com-福利彩票哪几天开奖| www.663680.com-福彩3d停止售票| www.768003.com-体彩开奖时间是几点| www.893229.com-内蒙古福彩网首页| www.979908.com-彩赢天下721cc| www.ek52.com-彩吧助手出号走势图| www.285853.com-我的彩票-| www.931414.com-高兴彩票app| www.73sr.com-总彩票心得体会| www.93700.com-新浪爱彩首页官网| www.65ft.com-怎么下载豪彩| www.771133.com-旋风彩虹机报价| www.70ii.com-福彩3b基本走式| www.738252.com-购彩网站代打靠谱吗| www.925020.com-彩彩吧-| 网易彩票www.076wy.com| www.861146.com-福利彩票各等奖奖金| www.924917.com-买彩票什么软件好| www.972516.com-彩铅画明星-| 幸运彩票www.444201.com| www.330953.com-财神彩票网是真的吗| www.919892.com-制作彩票app价格| www.668063.com-华人福彩-| www.982428.com-北京时时彩计划网页| www.72038.com-百胜快3彩票| www.913369.com-福彩吧提款失败| www.809570.com-福彩3d网冠彩| www.899547.com-彩票怎么定制跟单| www.972651.com-彩铅画图片风景卡通| www.035618.com-微信彩票计划群| www.723615.com-天下争霸彩票合法吗| www.913674.com-彩票游戏下载| www.3603.me-足球彩票怎么算钱| www.570202.com-彩票451-| www.695600.com-傅彩什么意思| www.407923.com-濮阳市结婚彩礼多少| www.678606.com-足彩赔率-| www.754668.com-彩票中数字规律题| www.848567.cc-快三选三不同号| www.908749.com-人人彩票网站下载| www.966892.com-福建快三直播| 金掌柜www.83993p.com| www.8313.loan-江西体彩兑奖的址| www.64800.com-竞彩总进球对冲滚球| www.311118.com-百度福彩3d返奖率| www.063686.com-五福彩票送彩金| www.172593.com-福彩快3软件| www.791384.com-福利彩票机选号有中| www.898561.cc-宁夏福彩开奖查询| www.993809.com-足彩胜负彩规则| www.nd18.com-卓易彩票-| www.317735.com-玩时时彩的经历| www.233010.com-新浪足彩冷热指数| www.318834.com-幸运28玩时时彩| www.629312.com-天天种彩票下载安装| www.716752.com-彩铅古风手绘| www.802512.com-体彩游泳夺金481| www.881471.com-国外足球博彩app| 鑫彩网www.xcw866.com| www.7698.net-特彩吧高手网499| www.75nr.com-足彩2场单场固定| www.6292.biz-湖北福利彩票点查询| www.386586.com-韩国音速彩票| www.067818.com-福彩五分钟开奖1次| www.247896.com-福彩投注是什么意思| www.389302.com-多彩葫芦-| www.566945.com-51中彩是真的吗| 金彩www.981jc.com| www.69767.com-贵港体彩中心| www.650.mobi-长春黑彩最新新闻| www.911694.com-七星体彩特区沦坛| www.966809.com-体彩多少天兑奖| 818合彩www.www.9889hc.com| www.187066.com-吉林快三有玩的吗| www.525916.com-世界杯买彩票规则|