代码拉取完成，页面将自动刷新
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
body{
padding: 0;
margin: 0;
}
/* logo */
#logo{
width: 100%;
background: url("https://it.ctgu.edu.cn/images/t1.jpg");
background-repeat: no-repeat;
background-size: cover;
position: relative;
}
#aline_main_part{
width: 1200px;
/* border: 1px solid black; */
position: relative;
left: 360px;
overflow: hidden;
}
#logo_part{
float: left;
width: 625px;
height: 140px;
padding-left: 20px;
}
#logo_part > img{
position: relative;
top: 25%;
}
#serch_part{
float: right;
height: 140px;
width: 400px;
position: relative;
padding-right: 20px;
}
#serch_unit{
position: relative;
top: 40%;
left: 35%;
}
#serch_box{
height: 32px;
width: 200px;
padding: 0;
margin: 0;
}
#serch_button{
height: 36px;
}
/* 导航栏 */
#catalogue{
height: 63px;
width: 1200px;
position: absolute;
left:360px;
text-align: center;
}
#cata_title{
width: 1200px;
text-align: center;
position: absolute;
left: 360px;
font-size: 15px;
}
.cata{
float: left;
height: 63px;
width: 9%;
text-align: center;
padding-top: 17px;
z-index: 1;
}
ul{
list-style: none;
display: none;
text-align: center;
background-color: #0b62c1;
width: 108px;
margin: 0;
padding: 0;
margin-top: 50px;
line-height: 2.2;
}
#gen_ul{
display: none;
position: absolute;
left:108px;
}
#news_ul{
display: none;
position: absolute;
left:216px;
}
#teac_ul{
display: none;
position: absolute;
left:324px;
}
#under_ul{
display: none;
position: absolute;
left:432px;
}
#post_ul{
display: none;
position: absolute;
left:540px;
}
#cons_ul{
display: none;
position: absolute;
left:648px;
}
#reserch_ul{
display: none;
position: absolute;
left:756px;
}
#party_ul{
display: none;
position: absolute;
left:864px;
}
#stu_ul{
display: none;
position: absolute;
left:972px;
}
#worker_ul{
display: none;
position: absolute;
left:1080px;
width: 104px;
}
#worker_house{
width: 104px;
}
#cata_title li:hover{
background-color: #3ea2ed;
color:#fff;
}
/* 主页图片 */
#images{
margin-top: 63px;
width: 1200px;
padding-left: 360px;
}
#images > img{
padding: o;
margin: 0;
z-index: 100;
}
/* 填充用内容 */
#main_body{
height: 1000px;
overflow: hidden;
display: flex;
width: 100%;
justify-content: center;
align-items: center;
position: relative;
}
#main_body::before{
content: '';
position: absolute;
bottom:0px;
width: 100%;
height: 80px;
background: linear-gradient(to top,#005a99,transparent);
}
#main_body::after{
content: '';
position: absolute;
top:0px;
width: 100%;
height: 80px;
background: linear-gradient(to top,transparent,#fff);
}
#star{
object-fit: cover;
/* object-fit 裁剪图片 */
width: 100%;
height: 100%;
pointer-events: none;
}
/* 底栏 */
#copyright{
background-color: #005a99;
padding: 10px;
}
p{
margin: 0;
padding: 0;
text-align: center;
font-size: 14px;
color: #fff;
}
</style>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.js"></script>
</head>
<body>
<div id="logo">
<div id="aline_main_part">
<div id="logo_part">
<img id="iconfont" src="https://it.ctgu.edu.cn/images/Iconfont.png" alt="">
</div>
<div id="serch_part">
<div id="serch_unit">
<input id="serch_box" type="text" placeholder=" 请输入关键字">
<input id="serch_button" type="button" value="搜索">
</div>
</div>
</div>
</div>
<div id="catalogue">
<!-- 导航栏第一行 -->
<div class="cata" id="idx">首页</div>
<div class="cata" id="general">学院概况</div>
<div class="cata" id="news">学院动态</div>
<div class="cata" id="teachers">师资队伍</div>
<div class="cata" id="undergraduate">本科生培养</div>
<div class="cata" id="postgraduate">研究生培养</div>
<div class="cata" id="construct">学科建设</div>
<div class="cata" id="reserch">科学研究</div>
<div class="cata" id="party_cons">党建工作</div>
<div class="cata" id="student_cons">学生工作</div>
<div class="cata" id="worker_house">教工之家</div>
</div>
<div>
<table id="cata_title">
<!-- 导航栏第二行，为隐藏行，显示二级菜单 -->
<tr>
<!-- 首页无下拉菜单 -->
<td></td>
<!-- 学院概况之后都有下拉菜单 -->
<td>
<ul id="gen_ul">
<li>学院介绍</li>
<li>学院领导</li>
<li>机构设置</li>
<li>发展规划</li>
<li>宣传视频</li>
</ul>
</td>
<td>
<ul id="news_ul">
<li>学院动态</li>
<li>通知公告</li>
<li>行业新闻</li>
<li>视频新闻</li>
</ul>
</td>
<td>
<ul id="teac_ul">
<li>师资概况</li>
<li>教师列表</li>
</ul>
</td>
<td>
<ul id="under_ul">
<li>部门概况</li>
<li>考试专栏</li>
<li>专业介绍</li>
<li>实践教学</li>
<li>文件下载</li>
<li>本科教务</li>
<li>留学生教务</li>
</ul>
</td>
<td>
<ul id="post_ul">
<li>部门概况</li>
<li>最新公告</li>
<li>学位点简介</li>
<li>招生信息</li>
<li>教师风采</li>
<li>培养方案</li>
<li>教学大纲</li>
<li>培养管理</li>
<li>学位管理</li>
<li>文件下载</li>
<li>本科教务</li>
<li>研究生教务</li>
</ul>
</td>
<td>
<ul id="cons_ul">
<li>学术动态</li>
<li>重点学科</li>
<li>基地建设</li>
<li>学术团队</li>
<li>学位点建议</li>
</ul>
</td>
<td>
<ul id="reserch_ul">
<li>部门概况</li>
<li>研究方向</li>
<li>最新公告</li>
<li>科研政策</li>
<li>科研项目</li>
<li>科研成果</li>
</ul>
</td>
<td>
<ul id="party_ul">
<li>部门概况</li>
<li>党建动态</li>
<li>组织机构</li>
<li>支部建设</li>
<li>党员风采</li>
<li>学习资料</li>
<li>党校培训</li>
<li>表格下载</li>
<li>党风廉政</li>
<li>创先争优</li>
</ul>
</td>
<td>
<ul id="stu_ul">
<li>学工概况</li>
<li>学工动态</li>
<li>招生动态</li>
</ul>
</td>
<td>
<ul id="worker_ul">
<li>工会概况</li>
<li>工会活动</li>
</ul>
</td>
</tr>
</table>
</div>
<div id="images">
<img id="rolling_img" src="https://it.ctgu.edu.cn/images/ban1.png" alt="">
<img id="img2" src="https://it.ctgu.edu.cn/images/ban2.png" alt="" style="display: none;">
<img id="img3" src="https://it.ctgu.edu.cn/images/ban3.png" alt="" style="display: none;">
</div>
<div id="main_body">
<img id="star" src="https://s3.bmp.ovh/imgs/2022/04/14/f4363b73ce1cdce2.jpg" alt="">
</div>
<div id="copyright">
<p>CopyRights ©2007-2008 All Rights Reserved 三峡大学计算机与信息学院</p>
<p>电 话：(0717)6393156 邮 编：443002</p>
<p>地 址：湖北省宜昌市大学路8号 电子邮件：jsjyb@ctgu.edu.cn</p>
</div>
<script>
$(function(){
// 单图片元素进行切换，重置index前不手动设置图片源为第一张图的时候最后一张图片切换到第一张图片用时比计时器的设定时间肉眼可见的更长
// 手动初始化图片源之后，最后一张图到第一张图以及第一二张图之间的切换时间比设定时间长
let img_arry=['https://it.ctgu.edu.cn/images/ban1.png','https://it.ctgu.edu.cn/images/ban2.png','https://it.ctgu.edu.cn/images/ban3.png'];
let index = 0;
let time;
clearInterval(time);
time = setInterval(function(){
if(index > img_arry.length){
$('#rolling_img').attr('src','https://it.ctgu.edu.cn/images/ban1.png')
index = 0;
}else{
$('#rolling_img').attr('src',img_arry[index])
index++;
}
},800)
// 多图片元素设置display进行切换，只显示第一张图片
// let flag = 0;
// let time;
// let id_array = ['#rolling_img','#img2','#img3'];
// clearInterval(time);
// time = setInterval(function(){
// $(id_array[flag]).css('display','none');
// flag++;
// if(flag > id_array.length){flag = 0;}
// $(id_array[flag]),css('display','block');
// },3000)
// 二级菜单触发
// 语句a,b都写，存在语句1，2，4：和存在语句1,4类似，鼠标移动到一级菜单时二级菜单出现，二级菜单的hover正常显示，
// 但只有从二级菜单移出鼠标时二级菜单才会正常消失，从一级菜单移出会导致二级菜单仍然存在。
// 语句a,b都写，存在语句1，3，4：和存在语句1,3一样，鼠标移出一级菜单时二级菜单就会消失，二级菜单的hover无法显示。
// a,b,1,2,3,4都写，移入一级菜单显示二级菜单，从一级和二级移出时二级菜单都会正常消失。
$('#general').mouseenter(function(){
$('#gen_ul').css('display','block');//语句a
$('#general').css('background-color','#0b62c1').css('color','#fff');//语句b
});// 语句1
$('#gen_ul').mouseenter(function(){
$('#gen_ul').css('display','block');
$('#general').css('background-color','#0b62c1').css('color','#fff');
});// 语句2
$('#general').mouseleave(function(){
$('#gen_ul').css('display','none');
$('#general').css('background-color','').css('color','black');
});// 语句3
$('#gen_ul').mouseleave(function(){
$('#gen_ul').css('display','none');
$('#general').css('background-color','').css('color','black');
});// 语句4
$('#news').mouseenter(function(){
$('#news_ul').css('display','block');//语句a
$('#news').css('background-color','#0b62c1').css('color','#fff');//语句b
});// 语句1
$('#news_ul').mouseenter(function(){
$('#news_ul').css('display','block');
$('#news').css('background-color','#0b62c1').css('color','#fff');
});// 语句2
$('#news').mouseleave(function(){
$('#news_ul').css('display','none');
$('#news').css('background-color','').css('color','black');
});// 语句3
$('#news_ul').mouseleave(function(){
$('#news_ul').css('display','none');
$('#news').css('background-color','').css('color','black');
});// 语句4
$('#teachers').mouseenter(function(){
$('#teac_ul').css('display','block');//语句a
$('#teachers').css('background-color','#0b62c1').css('color','#fff');//语句b
});// 语句1
$('#teac_ul').mouseenter(function(){
$('#teac_ul').css('display','block');
$('#teachers').css('background-color','#0b62c1').css('color','#fff');
});// 语句2
$('#teachers').mouseleave(function(){
$('#teac_ul').css('display','none');
$('#teachers').css('background-color','').css('color','black');
});// 语句3
$('#teac_ul').mouseleave(function(){
$('#teac_ul').css('display','none');
$('#teachers').css('background-color','').css('color','black');
});// 语句4
$('#undergraduate').mouseenter(function(){
$('#under_ul').css('display','block');//语句a
$('#undergraduate').css('background-color','#0b62c1').css('color','#fff');//语句b
});// 语句1
$('#under_ul').mouseenter(function(){
$('#under_ul').css('display','block');
$('#undergraduate').css('background-color','#0b62c1').css('color','#fff');
});// 语句2
$('#undergraduate').mouseleave(function(){
$('#under_ul').css('display','none');
$('#undergraduate').css('background-color','').css('color','black');
});// 语句3
$('#under_ul').mouseleave(function(){
$('#under_ul').css('display','none');
$('#undergraduate').css('background-color','').css('color','black');
});// 语句4
$('#postgraduate').mouseenter(function(){
$('#post_ul').css('display','block');//语句a
$('#postgraduate').css('background-color','#0b62c1').css('color','#fff');//语句b
});// 语句1
$('#post_ul').mouseenter(function(){
$('#post_ul').css('display','block');
$('#postgraduate').css('background-color','#0b62c1').css('color','#fff');
});// 语句2
$('#postgraduate').mouseleave(function(){
$('#post_ul').css('display','none');
$('#postgraduate').css('background-color','').css('color','black');
});// 语句3
$('#post_ul').mouseleave(function(){
$('#post_ul').css('display','none');
$('#postgraduate').css('background-color','').css('color','black');
});// 语句4
$('#construct').mouseenter(function(){
$('#cons_ul').css('display','block');//语句a
$('#construct').css('background-color','#0b62c1').css('color','#fff');//语句b
});// 语句1
$('#cons_ul').mouseenter(function(){
$('#cons_ul').css('display','block');
$('#construct').css('background-color','#0b62c1').css('color','#fff');
});// 语句2
$('#construct').mouseleave(function(){
$('#cons_ul').css('display','none');
$('#construct').css('background-color','').css('color','black');
});// 语句3
$('#cons_ul').mouseleave(function(){
$('#cons_ul').css('display','none');
$('#construct').css('background-color','').css('color','black');
});// 语句4
$('#reserch').mouseenter(function(){
$('#reserch_ul').css('display','block');//语句a
$('#reserch').css('background-color','#0b62c1').css('color','#fff');//语句b
});// 语句1
$('#reserch_ul').mouseenter(function(){
$('#reserch_ul').css('display','block');
$('#reserch').css('background-color','#0b62c1').css('color','#fff');
});// 语句2
$('#reserch').mouseleave(function(){
$('#reserch_ul').css('display','none');
$('#reserch').css('background-color','').css('color','black');
});// 语句3
$('#reserch_ul').mouseleave(function(){
$('#reserch_ul').css('display','none');
$('#reserch').css('background-color','').css('color','black');
});// 语句4
$('#party_cons').mouseenter(function(){
$('#party_ul').css('display','block');//语句a
$('#party_cons').css('background-color','#0b62c1').css('color','#fff');//语句b
});// 语句1
$('#party_ul').mouseenter(function(){
$('#party_ul').css('display','block');
$('#party_cons').css('background-color','#0b62c1').css('color','#fff');
});// 语句2
$('#party_cons').mouseleave(function(){
$('#party_ul').css('display','none');
$('#party_cons').css('background-color','').css('color','black');
});// 语句3
$('#party_ul').mouseleave(function(){
$('#party_ul').css('display','none');
$('#party_cons').css('background-color','').css('color','black');
});// 语句4
$('#student_cons').mouseenter(function(){
$('#stu_ul').css('display','block');//语句a
$('#student_cons').css('background-color','#0b62c1').css('color','#fff');//语句b
});// 语句1
$('#stu_ul').mouseenter(function(){
$('#stu_ul').css('display','block');
$('#student_cons').css('background-color','#0b62c1').css('color','#fff');
});// 语句2
$('#student_cons').mouseleave(function(){
$('#stu_ul').css('display','none');
$('#student_cons').css('background-color','').css('color','black');
});// 语句3
$('#stu_ul').mouseleave(function(){
$('#stu_ul').css('display','none');
$('#student_cons').css('background-color','').css('color','black');
});// 语句4
$('#worker_house').mouseenter(function(){
$('#worker_ul').css('display','block');//语句a
$('#worker_house').css('background-color','#0b62c1').css('color','#fff');//语句b
});// 语句1
$('#worker_ul').mouseenter(function(){
$('#worker_ul').css('display','block');
$('#worker_house').css('background-color','#0b62c1').css('color','#fff');
});// 语句2
$('#worker_house').mouseleave(function(){
$('#worker_ul').css('display','none');
$('#worker_house').css('background-color','').css('color','black');
});// 语句3
$('#worker_ul').mouseleave(function(){
$('#worker_ul').css('display','none');
$('#worker_house').css('background-color','').css('color','black');
});// 语句4
$('#idx').mouseenter(function(){
$('#idx').css('background-color','#0b62c1').css('color','#fff');
})
$('#idx').mouseleave(function(){
$('#idx').css('background-color','').css('color','black');
})
})
</script>
</body>
</html>
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
马建仓 AI 助手
