Difference between revisions of "Team:CPU CHINA/HP/Silver"
Ser Archer (Talk | contribs) |
Ser Archer (Talk | contribs) |
||
| (23 intermediate revisions by 2 users not shown) | |||
| Line 10: | Line 10: | ||
</head> | </head> | ||
<style> | <style> | ||
| − | |||
| − | |||
| − | |||
| + | #foot-c116{display:none;} | ||
| + | #globalWrapper{background-color:#f7f5f0 !important} | ||
.hp-block | .hp-block | ||
{ | { | ||
| Line 91: | Line 90: | ||
} | } | ||
| − | #ted-video,#ted-txt,.club-txt | + | #ted-video,#ted-txt,.club-txt,.booklet |
{ | { | ||
display:none; | display:none; | ||
| Line 99: | Line 98: | ||
height:80%; | height:80%; | ||
line-height:3.5rem; | line-height:3.5rem; | ||
| + | font-size:1.5rem !important; | ||
} | } | ||
| Line 107: | Line 107: | ||
top:-90% !important; | top:-90% !important; | ||
left:-120%; | left:-120%; | ||
| − | width: | + | width:300% !important; |
word-break:normal; | word-break:normal; | ||
display:none; | display:none; | ||
| Line 118: | Line 118: | ||
z-index:2000000000; | z-index:2000000000; | ||
} | } | ||
| + | |||
| + | .anniu { | ||
| + | position: relative; | ||
| + | top: -34em; | ||
| + | transition: top 0.2s; | ||
| + | margin: 0 0 0 10px; | ||
| + | } | ||
| + | |||
| + | .anniu>img { | ||
| + | height: 50px; | ||
| + | } | ||
| + | |||
| + | .anniu:hover { | ||
| + | top: 90px; | ||
| + | } | ||
| + | |||
</style> | </style> | ||
| Line 127: | Line 143: | ||
</button> | </button> | ||
<div id="Txt-btn1" class="Txt">Click me to watch Ted!</div> | <div id="Txt-btn1" class="Txt">Click me to watch Ted!</div> | ||
| + | <div id="arrow1" class="anniu"> | ||
| + | <img src="https://static.igem.org/mediawiki/2017/7/7e/T--HZAU-China--arrow.gif"> | ||
| + | </div> | ||
</div> | </div> | ||
| Line 134: | Line 153: | ||
</button> | </button> | ||
<div id="Txt-btn2" class="Txt">Click me to learn about our club!</div> | <div id="Txt-btn2" class="Txt">Click me to learn about our club!</div> | ||
| + | <div id="arrow2" class="anniu"> | ||
| + | <img src="https://static.igem.org/mediawiki/2017/7/7e/T--HZAU-China--arrow.gif"> | ||
| + | </div> | ||
</div> | </div> | ||
| Line 141: | Line 163: | ||
</button> | </button> | ||
<div id="Txt-btn3" class="Txt">Click me to open a booklet!</div> | <div id="Txt-btn3" class="Txt">Click me to open a booklet!</div> | ||
| + | <div id="arrow3" class="anniu"> | ||
| + | <img src="https://static.igem.org/mediawiki/2017/7/7e/T--HZAU-China--arrow.gif"> | ||
| + | </div> | ||
</div> | </div> | ||
| Line 214: | Line 239: | ||
<div id="club-txt9" class="club-txt" style="text-align:left;font-size:1.2em;"> | <div id="club-txt9" class="club-txt" style="text-align:left;font-size:1.2em;"> | ||
| − | <center>< | + | <center><https://2018.igem.org/File:T--CPU_CHINA--HP-booklet1.png" width="48%"></center> |
| − | + | ||
<center><p><a id="9" onclick="turnToNext(this.id)">[Read more]</a>  <a id="-9" onclick="turnBack(this.id)">[Backwards]</a></p></center> | <center><p><a id="9" onclick="turnToNext(this.id)">[Read more]</a>  <a id="-9" onclick="turnBack(this.id)">[Backwards]</a></p></center> | ||
</div> | </div> | ||
| Line 225: | Line 249: | ||
<div id="club-txt11" class="club-txt" style="text-align:left;font-size:1.2em;"> | <div id="club-txt11" class="club-txt" style="text-align:left;font-size:1.2em;"> | ||
| − | <center><img src="https://static.igem.org/mediawiki/2018/2/ | + | <center><img src="https://static.igem.org/mediawiki/2018/2/21/T--CPU_CHINA--HP-booklet2.png" width="48%"></center> |
| − | + | ||
<center><p><a id="11" onclick="turnToNext(this.id)">[Read more]</a>  <a id="-11" onclick="turnBack(this.id)">[Backwards]</a></p></center> | <center><p><a id="11" onclick="turnToNext(this.id)">[Read more]</a>  <a id="-11" onclick="turnBack(this.id)">[Backwards]</a></p></center> | ||
</div> | </div> | ||
| Line 266: | Line 289: | ||
| − | <!--*********************************** | + | <!--***********************************小册子介绍************************************ --> |
<div id="hp-block3" class="hp-block" style="display:none;"> | <div id="hp-block3" class="hp-block" style="display:none;"> | ||
<div class="page_content" style="text-align:center;font-family:'Century Gothic';"> | <div class="page_content" style="text-align:center;font-family:'Century Gothic';"> | ||
| − | <h2> | + | <div style="width:100%"><h2><a href="https://2018.igem.org/Team:CPU_CHINA/HP/Silver/Page">Booklet</a></h2></div> |
| + | <div id="booklet1" class="booklet" style="text-align:left;font-size:1.2em;display:block"> | ||
| + | We asked some questions about liver cancer in the survey. Hepatocellular carcinoma (HCC) is the fourth most common and the third most lethal cancer in China, accounting for 85–90% of primary liver malignancy. It is particularly prevalent in China because of the high prevalence of chronic hepatitis B infection. | ||
| + | |||
| + | Among the 200 participants, up to 11% report that their relatives or friends have been diagnosed with HCC. However, the interviewees generally only have a brief understanding about this disease, only 3% knows its early symptoms. Therefore, it is of vital importance to popularize relevant knowledge to the public so that the development of HCC might be discovered or prevented at an early stage.<br> | ||
| + | Tip:<a href="https://2018.igem.org/Team:CPU_CHINA/HP/Silver/Page">Please click here to read our booklet !</a> | ||
| + | <p><a id="1" onclick="turnToNext3(this.id)">[Read more]</p></center> | ||
| + | </div> | ||
| + | |||
| + | <div id="booklet2" class="booklet" style="text-align:left;font-size:1.2em;"> | ||
| + | <center><img src="https://static.igem.org/mediawiki/2018/d/d2/T--CPU_CHINA--HP-booklet1.png" width="80%"></center> | ||
| + | <center><p><a id="2" onclick="turnToNext3(this.id)">[Read more]</a>  <a id="-2" onclick="turnBack3(this.id)">[Backwards]</a></p></center> | ||
| + | </div> | ||
| + | |||
| + | <div id="booklet3" class="booklet" style="text-align:left;font-size:1.2em;"> | ||
| + | The World Health Organization believes that more than 40% of cancer can be prevented. Studies have shown that the occurrence of HCC is closely related to viral hepatitis, cirrhosis, aflatoxin and alcohol intake, all of which are preventable. Healthy lifestyle (e.g., regularly taking vitamins E and B) may also reduce the risk of HCC. Contrary to such facts, only half of the interviewees agree that cancer can be avoided with certain measures. What’s more, the majority consider cancer as some kind of senile disease and therefore no special attention is currently needed for the prevention of cancer. | ||
| + | <p><a id="3" onclick="turnToNext3(this.id)">[Read more]</a>  <a id="-3" onclick="turnBack3(this.id)">[Backwards]</a></p></center> | ||
| + | </div> | ||
| + | |||
| + | <div id="booklet4" class="booklet" style="text-align:left;font-size:1.2em;"> | ||
| + | <center><img src="https://static.igem.org/mediawiki/2018/2/21/T--CPU_CHINA--HP-booklet2.png" width="80%"></center> | ||
| + | <center><p><a id="4" onclick="turnToNext3(this.id)">[Read more]</a>  <a id="-4" onclick="turnBack3(this.id)">[Backwards]</a></p></center> | ||
| + | </div> | ||
| + | |||
| + | <div id="booklet5" class="booklet" style="text-align:left;font-size:1.2em;"> | ||
| + | In question 21, only 33% report that they take vitamins on a daily basis, suggesting that we can persuade people of the benefits of vitamin intake and furthermore reduce the probability of HCC by helping people develop vitamin-taking habits. Inspired by these results, we wrote a booklet about the prevention of HCC.(<a href="https://2018.igem.org/Team:CPU_CHINA/HP/Silver/Page">Click here to see the booklet</a>). | ||
| + | <p><a id="-5" onclick="turnBack3(this.id)">[Backwards]</a></p></center> | ||
</div> | </div> | ||
</div> | </div> | ||
| + | |||
</body> | </body> | ||
<script> | <script> | ||
| Line 327: | Line 377: | ||
}) | }) | ||
$("#scroll-3").click(function(){ | $("#scroll-3").click(function(){ | ||
| − | + | $("#hp-block1").hide(); | |
| + | $("#hp-block2").hide(); | ||
| + | $("#hp-block3").show(); | ||
| + | }) | ||
| + | $(".scroll-btn").click(function(){ | ||
| + | var v = document.getElementById("ted-video"); | ||
| + | v.pause(); | ||
}) | }) | ||
| − | |||
/*****************点击链接readmore/backwards******************/ | /*****************点击链接readmore/backwards******************/ | ||
function turnToNext(id){ | function turnToNext(id){ | ||
| Line 346: | Line 401: | ||
$("#club-txt"+id).show(); | $("#club-txt"+id).show(); | ||
} | } | ||
| + | |||
| + | function turnToNext3(id){ | ||
| + | id++; | ||
| + | $(".booklet").hide(); | ||
| + | $("#booklet"+id).show(); | ||
| + | } | ||
| + | function turnBack3(id){ | ||
| + | id=Math.abs(id); | ||
| + | id--; | ||
| + | $(".booklet").hide(); | ||
| + | $("#booklet"+id).show(); | ||
| + | } | ||
| + | |||
| + | function getQueryVariable(){ | ||
| + | //获得当前url地址的?后面的部分 | ||
| + | var query = window.location.search.substring(1); | ||
| + | query=decodeURI(query); | ||
| + | //从?开始往后的部分 | ||
| + | var x=query.split('='); | ||
| + | |||
| + | return x[0]; | ||
| + | } | ||
| + | |||
| + | $(document).ready(function(){ | ||
| + | if(getQueryVariable()=='club'){$("#scroll-2").click();} | ||
| + | }) | ||
</script> | </script> | ||
</html> | </html> | ||
Latest revision as of 14:31, 6 December 2018
Click me to watch Ted!
Click me to learn about our club!
Click me to open a booklet!
TED speech on campus
TEDxCPU is another student organization on our campus, they were licensed by TED officially. They provide a platform at school to tell stories, share interesting thoughts. In their Summer Lecture 2018, our leader, Huandi Xu made a speech named “Synthesis Biology—Create a better future.” He showed how synthesis biology can make our life more convenient and introduced iGEM to the audience, to promote public awareness of this field and this great international competition. There were nearly 100 people in the field watching. Some of them showed keen interest in synthesis biology after the speech, and approach Huandi for more information. (Click here to watch the video).
