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.yv37.com-釉中彩餐具的危害| www.574558.com-爱音乐彩铃电信下载| www.191719.com-江苏快三安卓版下载| www.4555.vip-七星彩历史中奖记录| www.870388.com-重庆时时彩官方| www.1040.space-乐彩网最新开奖结果| www.256166.com-澳客购彩-| www.670490.com-胜彩国际-| www.665534.com-七色彩虹床单四件套| www.645286.com-俄罗斯法贝热彩蛋| www.238042.com-爰彩乐-| www.388767.com-头头彩票网-| www.225456.com-3d彩民群微信群号| www.hl00.com-手机彩票预测软件| www.93wd.com-黑白照片一键变彩色| www.5292.pw-广东地方彩36选7| www.69ac.com-皇冠彩票捷豹| www.379606.com-中彩票是什么感觉| www.629381.com-如意彩网站-| www.2gf.cc-体彩有世界杯彩票吗| www.91309.com-好彩柠檬爆珠价格| www.268908.com-彩神vii安卓版| www.539744.com-360彩票导航杀号| www.994665.com-彩客网推荐-| www.689882.com-中国唯彩竞彩推荐| www.881752.com-辉煌彩票江苏快3| www.aa0.com-360彩票-| www.47qo.com-梦到刮彩票中17万| www.224691.com-下载五分彩-| www.345088.com-棋牌彩票的项目代理| www.12666.cc-福利彩票兑奖期多长| www.793777.cc-网上买彩票是赌博| www.521811.com-新浪爱彩必发指数| www.297163.com-十大彩票牛人| www.375958.com-网络购彩还没恢复| www.972274.com-福彩3d魔图-| www.7222.hk-彩虹娱乐棋牌下载码| www.73044.com-福彩字迷图迷迷语| www.mu66.com-微信天天中彩票下载| www.jn4.com-河北快三平台下载| www.x50.site-九资料彩票网| www.231544.com-彩票51中彩app| www.329610.com-福彩3d正版藏机图| www.953932.com-好彩柠檬双爆| www.798531.com-预知百盈快三的软件| www.882454.com-英国5分彩是骗局吗| www.960331.com-彩73注册送38元| 至尊彩票www.208990.com| www.pq65.com-梦想彩票平台| www.16tm.com-黑客更改彩票| www.94uq.com-699彩票官网苹果| www.930611.com-37皇冠彩票网| www.bm79.com-福彩30万都是托| www.u38.shop-福彩3d开奘结果| www.028476.com-大发快三是黑彩吗| www.117173.com-彩票赛车怎么玩法| www.194228.com-五分快三精准计划网| www.456489.com-芜湖体彩竞彩店| www.564196.com-加盟机器人福利彩票| www.636009.com-张翰七星彩开奖号码| www.830611.com-牛彩网藏机诗| www.981340.com-快三守号翻倍技巧| www.da04.com-人人中彩票腾牛网| www.138543.com-香港时时彩开奖号码| www.320680.com-智彩11选5走势图| www.418174.com-博彩对nba-| www.560805.com-足彩高手经验| www.713537.com-语文课文中彩那天| 彩客网www.ck8199.com| www.165377.com-71彩票正规吗| www.270551.com-577彩票苹果版| www.375592.com-福彩3d一天一胆| www.893537.com-快三和值奖金计算| www.21291.cc-268报彩神童| www.382609.com-安徽彩票怎么玩法| www.483896.com-香港彩富网小龙人| www.556193.com-爱彩乐吧-| www.5284.xyz-派彩网违法吗| www.85cb.com-彩93怎么样靠谱吗| www.53889.cc-大通彩票网页版| www.ph82.com-海南快三官网| www.fr56.com-福彩快三规律走势| www.322957.com-买双色球彩票怎么买| www.299988.com-足彩310分析预测| www.58353.com-银彩通app-| www.al21.com-广东福彩发行中心| www.057553.com-快彩平台怎么样| www.40ab.com-胜负彩41期开奖| www.753149.com-福彩跑马怎么玩| www.876429.com-3毛3d图牛彩| www.964625.com-创彩网骗我五十万| www.cai5600.com1分快三走势图| www.896660.com-我要快三走势图| www.881203.com-日彩网平台-| www.58ya.com-微信炫彩字体| www.254403.com-爱彩乐双色球助手| www.i91.vip-人人中彩票网买彩票| www.817211.com-快三怎么样注册| www.356005.com-豪彩彩票娱乐注册| www.36844.com-彩票app白菜群| www.448635.com-说彩论赢双色球| www.460883.com-福利彩票在哪里买| www.553207.com-张家口体育彩票中心| www.130263.com-江苏快三漏洞| www.251501.com-彩96app下载| www.341062.com-电脑版牛材网彩摘网| www.479178.com-扬州体彩中1000| www.575615.com-九九彩票网址| www.459303.com-七星彩票开奖历史| www.535865.com-北京快乐8开奖彩票| www.424776.com-足彩伤停情况| www.539398.com-高温釉上彩安全吗| www.9009.online智胜彩票软件下载| www.235326.com-福彩网平台软件| www.309697.com-体彩中心-| www.523423.com-喜乐彩游戏规则| www.441120.com-彩票胆拖怎样玩| www.727529.com-728彩票-| www.805351.com-中超竞彩-| www.893060.com-福彩遗漏数据彩经网| www.963636.com-足彩彩票怎么买| 盈彩票www.533551.com| www.ou5.cc-11选5彩票-| www.7638.tv-福彩双色球擂台赛| www.126706.com-大众彩票手机版| www.266237.com-恒大彩票可靠吗| 大众彩票www.328229.com| www.941104.com-大发快三代打| www.995565.com-北单竞彩比赛结果| www.ol6.com-福利彩票3d倍数| www.542599.com-欢乐彩网站正规吗| www.237497.com-多彩网辽宁12选五| www.973312.com-废彩票变工艺品| www.4529.org-第19035期体彩| www.9933.top-奥百万彩票旧版| www.079397.com-90彩票网官方网址| www.640400.com-迅雷新浪彩票| www.595142.com-四季发财彩票| www.118713.com-大发快三有没有规律| www.506065.com-今天福彩3d蜂巢图| www.83vp.com-福彩3d乐彩谜语| www.985383.com-幽默的彩票广告语| www.la64.com-棒棒彩票网页| www.7490.in-彩票销售限额| www.12666.cc-福利彩票兑奖期多长| www.168010.com-银川快三走势图| www.2884.pw-彩票平台搭建出租| www.602290.com-乐彩客下载安装| www.yz15.com-兰州福彩中心在哪里| www.167295.com-快三是国家允许吗| www.520920.cc-时时彩杀3码| PK彩票www.www.23040.com| www.64273.com-竞彩网有app吗| www.256310.com-中彩彩票计划下载| www.319996.com-排列五走势图彩贝网| www.24591.com-彩铅风景画春天| www.948957.com-3d彩票彩图下载| www.177294.com-彩票下级设置返点| www.299418.com-体彩最新开奖信息| www.33xo.com-摇彩票号码机| www.00499.com-福彩网开奖号码| www.32ox.com-v8彩票能提款吗| www.wj96.com-新浪彩票数据| www.164755.com-彩票大厅下载|