1 Star 0 Fork 0

blank的小粉er / medicineWeb

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
该仓库未声明开源许可证文件(LICENSE),使用请关注具体项目描述及其代码上游依赖。
克隆/下载
p2.html 10.37 KB
一键复制 编辑 Web IDE 原始数据 按行查看 历史
郭凌峰 提交于 2018-06-25 16:35 . 需求改动
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>About us</title>
<link rel="stylesheet" href="css/reset.css">
<link rel="Shortcut Icon" href="images/icon.png" type="image/x-icon">
<style>
/*选项卡的样式*/
.option_card {
width: 90%;
margin: 100px auto;
overflow: hidden;
}
.option_card .options {
width: 23%;
float: left;
border-right: 1px solid #e5e5e5;
}
.option_card .options li {
height: 35px;
line-height: 35px;
color: #000;
cursor: pointer;
margin-top: 12px;
width: 99.2%;
font-size: 16px;
}
.option_card .options li:last-child {
margin-bottom: 12px;
}
.option_card .options li.current {
border-right: 5px solid #fab554;
color: #fab554;
}
.option_card .card {
width: 76%;
float: right;
margin: 0 auto;
}
.option_card .card .ul {
width: 90%;
margin: 0 auto;
/*border:1px solid green;*/
overflow: hidden;
}
.option_card .card .li {
display: none;
}
.option_card .card li.current {
display: block;
}
.option_card .card dl {
overflow: hidden;
margin-bottom: 20px;
}
/*第四个选项卡的效果*/
.option_card .card .flex-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
.option_card .card .management {
width: 300px;
float: left;
}
.option_card .card .management dd {
width: 300px
}
.option_card .card .management dd img {
width: 100%;
}
.option_card .card .management dt p {
color: #999;
margin-left: 5px;
margin-top: 10px;
}
.option_card .card dt .title1 {
color: #17b8c6;
font-size: 22px;
}
.option_card .card dt .title2 {
color: #fab554;
}
.option_card .card dt span {
margin-right: 10px;
}
/*第六个选项卡的效果*/
.option_card .card .inbestor dd {
width: 20%;
float: left;
}
.option_card .card .lastinbestor img{
box-shadow:0px 0px 0px 0px #fff;
}
.option_card .card img{
box-shadow: 0px 0px 5px 0px #999;
}
.option_card .card #managementTeamCon img,.option_card .card .inbestor img{
width: 100%;
margin-top: 10px;
margin-left: 5px;
}
.option_card .card .inbestor dt {
width: 80%;
float: right;
padding-left: 5%;
box-sizing: border-box;
}
.option_card .card .inbestor dt h3 {
color: #17b8c6;
margin-top: 2px;
}
.option_card .card .inbestor dt p {
color: #999;
line-height: 30px;
}
.option_card .card li, .option_card .card p{
line-height: 30px;
}
#scientificCon dl{
width: 100%;
padding-bottom: 30px;
}
#scientificCon dd{
width: 25%;
float: left;
}
#scientificCon dd img{
width: 144px;
height: 144px;
border-radius: 50%;
box-shadow: 0px 0px 5px 0px #999;
}
#scientificCon dt {
width: 75%;
float: right;
}
#managementTeamCon dd img{
box-shadow: 0px 0px 5px 0px #999;
}
</style>
</head>
<body>
<!-- 头部/ -->
<div class="header">
<div class="nav">
<div class="logo"><img src="images/logo_01.png" alt=""></div>
<ul class="navul">
<li><a href="index.html">Home</a></li>
<li><a href="p2.html" style="font-weight:bold;font-style: italic;">About us</a>
<ul class="child">
<li><a href="p2.html?id=1">Overview</a></li>
<li><a href="p2.html?id=2">CEO Message</a></li>
<li><a href="p2.html?id=3">Vision and Mission</a></li>
<li><a href="p2.html?id=4">Management Team</a></li>
<li><a href="p2.html?id=5">Scientific Advisory Board</a></li>
<li><a href="p2.html?id=6">Investors</a></li>
</ul>
</li>
<li>
<a href="p3.html">R&D</a>
<ul class="child">
<li><a href="p3.html">Pipeline</a></li>
<!-- <li><a href="p3.html?id=2">Pre-clinical Development</a></li>
<li><a href="p3.html?id=3">Clinical & Regulatory</a></li> -->
<li><a href="p3.html?id=4">Facility</a></li>
</ul>
</li>
<li>
<a href="p4.html">Partnerships</a>
<ul class="child">
<li><a href="p4.html">Business Development</a></li>
<li><a href="p4.html?id=2">Partners</a></li>
</ul>
</li>
<li><a href="p5.html">News</a></li>
<li>
<a href="p6.html">Contact</a>
</li>
</ul>
</div>
</div>
<div class="main">
<div class="option_card">
<div class="options">
<ul>
<li class="current" id="Overview">Overview</li>
<li id="CeoMessage">CEO Message</li>
<li id="Vision">Vision and Misson</li>
<li id="managementTeam">Management Team</li>
<li id="scientific">Scientific Advisory Board</li>
<li id="investor">Investors</li>
</ul>
</div>
<div class="card">
<ul class="ul">
<li class="current li" id="OverviewCon"></li>
<li class="li" id="CeoMessageCon"></li>
<li class="li" id="VisionCon"></li>
<li class="li" id="managementTeamCon"></li>
<li class="li">
<div class='flex-container' id="scientificCon">
</div>
</li>
<li class="li" id="investorCon"></li>
</ul>
</div>
</div>
</div>
<!-- 底部导航 -->
<div class="footer">
<div class="footer_nav">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="p2.html" style="font-weight:bold;font-style: italic;">About us</a></li>
<li><a href="p3.html">R&D</a></li>
<li><a href="p4.html">Partnerships</a></li>
<li><a href="p5.html">News</a></li>
<li><a href="p6.html">Contact</a></li>
</ul>
<div class="logo"><img src="images/footer_logo.png" alt=""></div>
</div>
</div>
<!-- 版权信息 -->
<div class="copy">
<p>Copyright 2018 © EOC Pharma 沪ICP备 17043104号
</p>
</div>
<script src="js/jquery-1.12.4.min.js"></script>
<script src="js/public.js"></script>
<script>
//选项卡事件
$(".options li").click(function() {
// $(this).addClass('current').siblings().removeClass('current');
// $(".card li").hide().eq($(this).index()).show();
window.location = "p2.html?page=" + ($(this).index() + 1);
})
if (GetQueryString("id") == null) {
$(".card li").hide().eq(0).show();
console.log("id1")
} else {
$(".card li").hide().eq(GetQueryString("id") - 1).show();
$(".options li").removeClass('current').eq(GetQueryString("id") - 1).addClass('current');
console.log("id2")
}
if (GetQueryString("page")) {
if (GetQueryString("page") == 1) {
$(".card li").hide().eq(0).show();
console.log("page1")
} else {
console.log("page2")
$(".card li").hide().eq(GetQueryString("page") - 1).show();
$(".options li").removeClass('current').eq(GetQueryString("page") - 1).addClass('current');
}
}
//页面一开始就加载公司介绍的接口
OverviewApi();
// 请求公司介绍接口
$("#Overview").click(function() {
OverviewApi();
});
//请求CEO寄语接口
$("#CeoMessage").click(function() {
CeoMessageApi();
});
if (GetQueryString("id") == 2 || GetQueryString("page") == 2) {
CeoMessageApi();
}
//请求公司愿景接口
$("#Vision").click(function() {
companyVisionApi();
});
if (GetQueryString("id") == 3 || GetQueryString("page") == 3) {
companyVisionApi();
}
//请求管理团队接口managementTeam
$("#managementTeam").click(function() {
managementTeamApi();
});
if (GetQueryString("id") == 4 || GetQueryString("page") == 4) {
managementTeamApi();
}
// 请求科学顾问委员会接口
$("#scientific").click(function() {
scientificConsultantApi();
});
if (GetQueryString("id") == 5 || GetQueryString("page") == 5) {
scientificConsultantApi();
}
// 请求投资人接口
$("#investor").click(function() {
investorApi();
});
if (GetQueryString("id") == 6 || GetQueryString("page") == 6) {
investorApi();
}
backgroundApi()
</script>
</body>
</html>
1
https://gitee.com/blankxf/medicineWeb.git
git@gitee.com:blankxf/medicineWeb.git
blankxf
medicineWeb
medicineWeb
master

搜索帮助

14c37bed 8189591 565d56ea 8189591