-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
12th--MINUS FIX(FOR mry's discovery)
- Loading branch information
Showing
9 changed files
with
840 additions
and
2 deletions.
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,240 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<link rel="stylesheet" href="../css/preload.css"> | ||
<link rel="stylesheet" href="../css/project.css"> | ||
<link rel="stylesheet" href="../css/base.css"> | ||
<link rel="stylesheet" href="../css/tu.css"> | ||
<link rel="stylesheet" href="../css/footer.css"> | ||
<link rel="stylesheet" href="../css/page_second_half.css"> | ||
<script type="text/javascript" src="../extras/jquery.min.1.7.js"></script> | ||
<script type="text/javascript" src="../extras/jquery-ui-1.8.20.custom.min.js"></script> | ||
<script type="text/javascript" src="../extras/jquery.mousewheel.min.js"></script> | ||
<script type="text/javascript" src="../extras/modernizr.2.5.3.min.js"></script> | ||
<title>Document</title> | ||
</head> | ||
<body> | ||
<script> | ||
window.addEventListener('load', function () { | ||
var loader = document.getElementById('preload'); | ||
setTimeout(function () { | ||
loader.style.display = 'none'; | ||
}, 2000); | ||
}); | ||
</script> | ||
<div id="preload" class="preload"> | ||
<link rel="stylesheet" href="../css/preload.css"> | ||
<img src="../loading.gif" alt="Loading..."> | ||
</div> | ||
|
||
<section class="navbar" id="navbar"> | ||
<!-- logo部分 --> | ||
<div class="logo"> | ||
<a href="#"> | ||
<img class="nav-logo" src="../images/logo.svg" alt=""> | ||
</a> | ||
</div> | ||
<!-- nav部分 --> | ||
<ul id="nav" class="nav"> | ||
<li class="slide2"></li> | ||
<li class="dropdown-menu"> | ||
<a href="../index.html" class="dropdown-a"> | ||
<img src="../images/home1.svg" alt="" class="icon1"> | ||
<img src="../images/home2.svg" alt="" class="icon_home2"> | ||
Home | ||
</a> | ||
</li> | ||
|
||
<li class="dropdown-menu"> | ||
<a href="#" class="dropdown-a"> | ||
<img src="../images/pro1.svg" alt="" class="icon3"> | ||
<img src="../images/pro2.svg" alt="" class="icon_pro3"> | ||
Project | ||
</a> | ||
<div class="dropdown-content" style="width: 156.48px;"> | ||
<a href="./description.html" class="dropdown-page cool-link2"> | ||
Description | ||
</a> | ||
<a href="./design.html" class="dropdown-page cool-link2"> | ||
Design | ||
</a> | ||
<a href="/pages/NAU-CHINA-DE main 10.4 终.pdf" class="dropdown-page cool-link2"> | ||
Results | ||
</a> | ||
<a href="#" class="dropdown-page cool-link2" target="_blank"> | ||
Supplement | ||
</a> | ||
<a href="#" class="dropdown-page cool-link2" target="_blank"> | ||
Protocol | ||
</a> | ||
</div> | ||
</li> | ||
<li class="dropdown-menu"> | ||
|
||
<a href="./notebook.html" class="dropdown-a"> | ||
<img src="../images/lab1.svg" alt="" class="icon4"> | ||
<img src="../images/lab2.svg" alt="" class="icon_lab4"> | ||
Lab Notebook | ||
</a> | ||
</li> | ||
<li class="dropdown-menu"> | ||
<a href="./member.html" class="dropdown-a"> | ||
<img src="../images/single_gear.gif" alt="" class="icon2" id="gif-image"> | ||
Team | ||
</a> | ||
<div class="dropdown-content" style="width: 140.39px;"> | ||
<a href="./member.html" class="dropdown-page cool-link2">Members</a> | ||
<a href="#" class="dropdown-page cool-link2">Contribution</a> | ||
</div> | ||
</li> | ||
<script> | ||
var gifImage = document.getElementById('gif-image'); | ||
|
||
gifImage.addEventListener('mouseenter', function () { | ||
gifImage.src = gifImage.src; // 重新加载 GIF 图像 | ||
}); | ||
</script> | ||
</ul> | ||
</section> | ||
<script> | ||
$("#nav a").on("click", function () { | ||
var position = $(this).parent().position(); | ||
var width = $(this).parent().width(); | ||
$("#nav .slide1").css({ opacity: 1, left: +position.left, width: width }); | ||
}); | ||
$("#nav a").on("mouseover", function () { | ||
var position = $(this).parent().position(); | ||
var width = $(this).parent().width(); | ||
$("#nav .slide2").css({ opacity: 1, left: +position.left, width: width }).addClass("squeeze"); | ||
}); | ||
$("#nav a").on("mouseout", function () { | ||
$("#nav .slide2").css({ opacity: 0 }).removeClass("squeeze"); | ||
}); | ||
var currentWidth = $("#nav li:nth-of-type(3) a").parent("li").width(); | ||
var current = $("li:nth-of-type(3) a").position(); | ||
$("#nav .slide1").css({ left: +current.left, width: currentWidth }); | ||
</script> | ||
<script> | ||
let lastScrollTop = 0; | ||
const navbar = document.getElementById('navbar'); | ||
|
||
window.addEventListener('scroll', function () { | ||
let scrollTop = window.pageYOffset || document.documentElement.scrollTop; | ||
|
||
if (scrollTop > lastScrollTop) { | ||
// 向下滚动,隐藏导航栏 | ||
navbar.style.top = "-100px"; // 隐藏导航栏 | ||
} else { | ||
// 向上滚动,显示导航栏 | ||
navbar.style.top = "0"; // 显示导航栏 | ||
} | ||
lastScrollTop = scrollTop <= 0 ? 0 : scrollTop; // For Mobile or negative scrolling | ||
}); | ||
</script> | ||
<section class="description_container"> | ||
<div class="title" id="Pathway">Introduction</div> | ||
<p>The project we chose this year was difficult for undergraduates, but it was pleasing to have some help as we stumbled | ||
along the way. With great honor, we were glad to find some collaborators and communicated with them. | ||
They reminded us that we were not a single team but a traveller who would finally meet partners with a common goal.</p> | ||
<div class="title" id="Pathway">NAU-CHINA</div> | ||
<p>Being our brother team, iGEM from Nanjing Agriculture University provided us critical help. We shared the same lab and | ||
meeting room, we chatted with each other and supported each other. It is the iGEMers’ support that gave us such | ||
motivation to complete the whole experiment. | ||
</p> | ||
|
||
<div class="description_img_container"> | ||
<img src="../images/collaboration.png" alt="" class="description_img" | ||
style="width: 400px;position: relative;right: -230px;"> | ||
</div> | ||
</section> | ||
|
||
<script> | ||
document.querySelectorAll('.table_of_content a').forEach(anchor => { | ||
anchor.addEventListener('click', function (e) { | ||
e.preventDefault(); | ||
const targetId = this.getAttribute('href').substring(1); | ||
const targetElement = document.getElementById(targetId); | ||
const offset = 100; | ||
const elementPosition = targetElement.getBoundingClientRect().top; | ||
const offsetPosition = elementPosition + window.pageYOffset - offset; | ||
|
||
window.scrollTo({ | ||
top: offsetPosition, | ||
behavior: 'smooth' | ||
}); | ||
}); | ||
}); | ||
</script> | ||
<div class="waves-container"> | ||
<svg class="editorial" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" | ||
viewBox="0 0 300 60" preserveAspectRatio="none"> | ||
<defs> | ||
<path id="gentle-wave" | ||
d="m 0 20 c 25 0 25 -20 50 -20 s 30 20 50 20 s 25 -20 50 -20 s 30 20 50 20 s 25 -20 50 -20 s 30 20 50 20 s 25 -20 50 -20 s 25 20 50 20 v 30 h -400 z" /> | ||
</defs> | ||
<g class="parallax"> | ||
<use xlink:href="#gentle-wave" x="1" y="0" fill="#35768a" /> | ||
<use xlink:href="#gentle-wave" x="3" y="10" fill="#b0cd89" /> | ||
<use xlink:href="#gentle-wave" x="5" y="20" fill="#a4d1cc" /> | ||
</g> | ||
</svg> | ||
</div> | ||
</div> | ||
<section class="footer"> | ||
|
||
<div class="grid-wrapper"> | ||
<div class="grid-logo"> | ||
<img src="../images/footerpic/logo.svg" alt="" class="footlogo footer-tag logotag" id="tag1"> | ||
<img src="../images/footerpic/NJAU.png" alt="" class="footlogo footer-tag" id="tag2"> | ||
<img src="../images/footerpic/sky.png" alt="" class="footlogo footer-tag" id="tag3"> | ||
<img src="../images/footerpic/诺1.png" alt="" class="footlogo footer-tag" id="tag4"> | ||
<img src="../images/footerpic/NEB.png" alt="" class="footlogo footer-tag" id="tag5"> | ||
<img src="../images/footerpic/genstar.png" alt="" class="footlogo footer-tag" id="tag6"> | ||
<img src="../images/footerpic/ala.jpg" alt="" class="footlogo footer-tag" id="tag7"> | ||
</div> | ||
<!-- lianjie1-4为footer右侧四列 --> | ||
<div class="lianjie1"> | ||
<h1 class="footer-tag" id="tag1"><a href="">Home</a></h1> | ||
</div> | ||
<div class="lianjie2"> | ||
<h1 class="footer-tag" id="tag2"><a href="">Project</a></h1> | ||
<h1 class="footer-tag" id="tag3"><a href="">Description</a></h1> | ||
<h1 class="footer-tag" id="tag4"><a href="">Design</a></h1> | ||
<h1 class="footer-tag" id="tag5"><a href="">Results</a></h1> | ||
<h1 class="footer-tag" id="tag6"><a href="">Supplement</a></h1> | ||
<h1 class="footer-tag" id="tag7"><a href="">Protocol</a></h1> | ||
</div> | ||
<div class="lianjie3"> | ||
<h1 class="footer-tag" id="tag8"><a href="">Lab Notebook</a></h1> | ||
</div> | ||
<div class="lianjie4"> | ||
<h1 class="footer-tag" id="tag9"><a href="">Team</a></h1> | ||
<h1 class="footer-tag" id="tag10"><a href="">Collaboration</a></h1> | ||
</div> | ||
|
||
</div> | ||
</section> | ||
<script> | ||
function isInViewport(element) { | ||
const rect = element.getBoundingClientRect(); | ||
return ( | ||
rect.top >= 0 && | ||
rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) | ||
); | ||
} | ||
|
||
function handleScroll() { | ||
const tags = document.querySelectorAll('.footer-tag'); | ||
tags.forEach(tag => { | ||
if (isInViewport(tag)) { | ||
tag.classList.add('visible'); | ||
} | ||
}); | ||
} | ||
|
||
window.addEventListener('scroll', handleScroll); | ||
</script> | ||
</body> | ||
</html> |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Oops, something went wrong.