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天

知道了
彩票123现在叫什么名字 www.564577.com-东方彩票一投入梦想| www.751799.com-彩90彩票官方网站| www.833247.com-日本好彩多少钱一包| www.918516.com-篮球彩票软件| www.977371.com-世界杯足彩哪里买| www.cp6715.com-江苏快三真能赚钱吗| www.199472.com-体彩排三遗漏统计| www.665541.com-昨天晚上七乐彩开奖| www.796748.com-体彩排列三综合走图| www.879088.com-合肥彩票站转让| www.931666.com-众盈网彩票安全吗| www.62297.cc-海南彩票梦册查码| www.g72.club-彩宝网3d开奖结果| www.7422.cm-邻近色彩构成图片| www.69291.com-足彩奖金怎么计算的| www.815299.com-排列5福彩-| www.098523.com-彩票快三图-| www.377839.com-体彩大乐透河南中奖| www.507523.com-955娱乐彩票网| www.4796.org-彩票5星统计软件| www.3407.vip-彩报王图-| www.458338.com-梦见亲人买彩票| www.567986.com-彩票11选五云南| www.639184.com-体彩密测电话号码| www.828019.com-彩民争霸app下载| www.511336.com-彩虹取名-| www.0348.net-内蒙快三出豹子规律| www.7460.cn-哪里可以网上买彩票| www.yl93.com-福利彩票大乐购| www.254623.com-好多人骗别人玩彩票| www.196369.com-百宝彩一江苏快3| www.142883.com-彩九九下载安装| www.835260.com-好彩1871蓝-| www.963391.com-海南体彩七星彩论坛| www.yy9.cc-快三助手软件下载| www.68wc.com-分分彩必赚投注方法| www.7308.org-彩虹六号联赛| www.69064.com-今日彩票谜语| www.445.xyz-手机购彩软件赚钱| www.955667.com-四虎彩影-| 百姓彩票www.bxcp3.com| www.25569.com-彩客网71212| www.371517.com-577彩票可靠吗| www.692922.com-中国竞彩赛果| www.781766.com-福彩三的分析| www.871320.com-彩71彩票网-| www.sj74.com-北京时时彩投注软件| www.0660.org-首尔1.5分彩| www.16324.com-彩客网是不是骗人的| 361彩票www.361944.com| www.114025.com-福彩案进展-| www.220073.com-1分钟开的彩票| 500彩票www.397836.com| www.123460.com-时时彩几分钟开一次| 500彩票www.613591.com| www.0338.com-漳州市福彩中心电话| www.19978.cc-彩票网络平台出售| www.778052.com-彩88彩票下载| www.1934.xyz-极客彩票-| www.5556.me-万彩彩票三d| www.77569.com-彩票如何中大奖| www.807198.com-温州福利彩票转让| www.978916.com-河南省福彩中心职工| www.m80.org-彩票输的倾家荡产| www.0130.loan-彩色算颜色的词语吗| www.33548.com-彩色沥青是什么东西| www.757891.com-亿佰彩票是真的吗| www.977339.com-烟台彩礼2018| www.35155.cc-福利彩票阳光探码图| www.662370.com-七星彩售卖截止时间| www.893198.com-爱彩乐广东11| www.4540.net-天娱彩票靠谱么| www.192236.com-南粤36选7好彩3| www.394747.com-彩虹六号季票| www.634232.com-七彩坊加盟-| www.313140.com-大发快三计划助手| www.649989.com-澳门博彩税收| www.870267.com-深圳侯彩彩票合法吗| www.47154.com-体彩竞彩开奖结果| www.009798.com-澳客网、足球彩| www.093312.com-怎么玩快频彩票| www.165460.com-1分钟开的彩票平台| www.787301.com-福建体彩购买方法| www.723632.com-体彩大乐透亿元大奖| www.743258.com-送彩金提现棋牌游戏| www.947086.com-体彩高频改革| www.42za.com-彩票做计划什么意思| www.021911.com-酷彩app-| www.30780.com-九鼎彩票-| www.86952.com-七星彩二等奖几个号| www.360298.com-福彩3d图吧-| www.69872.com-百盈时时彩规律| www.72249.com-福彩3d字谜多彩网| www.203.org-彩铅素描香蕉| www.133573.com-易彩网怎么赚钱| www.1914.vip-中昂彩云台地址| www.655390.com-玩彩可以赚到钱吗| www.293345.com-pp彩票下载-| www.881249.com-竞彩篮球合买推荐| www.969616.com-足球竞彩比赛结果| 博友彩www.960923.com| www.l60.top-爱购彩app下| www.627848.com-有盈彩票官网| www.732445.com-江苏体彩唯一官网| www.911505.com-网易福彩开奖| www.870.pw-彩票数学公式方法| www.432728.com-铜仁市福彩中心在哪| www.318207.com-博彩是什么-| www.385664.com-福利彩票彩宝贝| www.569112.com-福彩双色球后区全买| www.503223.com-艺彩印刷厂-| www.572917.com-彩经众乐三分快3| www.555382.com-江苏快三视频讲解| www.091450.com-福彩与体彩那个真实| www.16846.com-彩票洗烂了还能兑奖| www.554873.com-体彩19038期| www.892278.com-福彩3d3d下载| www.ls3.cc-福彩快三有假吗| www.29uj.com-今天彩票是什么| www.2153.com-互联网彩票新闻| www.977476.com-哪种彩票app好| 博友彩www.960106.com| www.898890.com-王牌彩票下载安装| www.979392.com-欧盟好彩双爆价格| www.fy.com-我要中彩app| www.978939.com-聋哑人中彩彩票网| www.74zk.com-体彩什么时候开卖| www.54407.cc-时时彩怎么可以稳赢| www.019814.com-彩之星登陆-| www.103702.com-手机福利彩票下载| www.158479.com-高频快彩研究院| www.221559.com-一分快三稳赚公式| www.281654.com-彩之家邀请码是多少| www.61ch.com-七星彩开奖丨| www.798415.com-乐彩字谜图谜| www.522216.com-乐享彩票app下载| www.655342.com-台湾福星彩官网彩图| www.vg76.com-江苏省苏州福彩网| www.307275.com-韩国快三是真的吗| www.48cv.com-荣耀彩票网址| www.279.cm-彩妆高档品牌| www.65ot.com-开彩票站怎么提成| www.680389.com-宁夏福彩网点怎么开| www.10903.cc-彩票倍投预算软件| www.272591.com-彩票走势网首页| www.23812.cc-贵州快三奖励规则| www.269021.com-珠江彩票计划网址| www.999132.cc-彩乐汇聊天-| www.kq54.com-一分一期彩票| www.wt46.com-今晚南洋彩开奖结果| www.88979.com-连中彩票王-| www.76ig.com-宏盛彩票软件官网| www.0772.live-137彩票软件下载| www.4861.net-梦到彩票店-| www.8710.cn-体彩19045期| www.356264.com-福彩大乐透怎么玩法| www.598638.com-七乐彩35期号码| www.593695.com-七彩云染化电商| www.52255.com-亚博彩票ios| www.900016.cc-福利彩票店装修图| 大赢家彩票平台www.689631.com| www.yg19.com-大发快三看和值| www.05le.com-老梁说彩票那件事| www.81co.com-彩民村双色球分布图|