Difference between revisions of "Team:HZAU-China/Human Practices"

Line 1: Line 1:
−
{{HZAU-China}}
+
{{HZAU-China/Bootstrap}}
−
 
+
 
<html>
 
<html>
  
−
<div class="column full_size judges-will-not-evaluate">
+
<head>
−
<h3>★  ALERT! </h3>
+
    <meta charset="UTF-8">
−
<p>This page is used by the judges to evaluate your team for the <a href="https://2018.igem.org/Judging/Medals">medal criterion</a> or <a href="https://2018.igem.org/Judging/Awards"> award listed below</a>. </p>
+
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
−
<p> Delete this box in order to be evaluated for this medal criterion and/or award. See more information at <a href="https://2018.igem.org/Judging/Pages_for_Awards"> Instructions for Pages for awards</a>.</p>
+
    <link href="bootstrap.min.css" rel="stylesheet">
−
</div>
+
    <!-- 导航栏CSS -->
 +
    <style type="text/css">
 +
        #sideMenu,
 +
        #top_title,
 +
        #team_submenu {
 +
            display: none;
 +
        }
 +
 
 +
        #HQ_page p {
 +
            margin: 0 !important;
 +
        }
 +
 
 +
        #content {
 +
            padding: 0px;
 +
            width: 100%;
 +
            margin-top: 0px;
 +
            margin-left: 0px;
 +
        }
 +
 
 +
        #bodyContent h1,
 +
        #bodyContent h2,
 +
        #bodyContent h3,
 +
        #bodyContent h4,
 +
        #bodyContent h5 {
 +
            margin-bottom: 0px;
 +
        }
 +
 
 +
        #team_name {
 +
            display: none
 +
        }
 +
 
 +
        .global_wrapper {
 +
            padding: 0px 0px 0px 0px;
 +
        }
 +
 
 +
        #top_menu_14 {
 +
            height: 16px;
 +
        }
 +
 
 +
        * {
 +
            margin: 0;
 +
            padding: 0;
 +
            list-style: none;
 +
            list-style-type: none;
 +
            text-decoration: none !important;
 +
        }
 +
 
 +
        body {
 +
            margin: 0;
 +
            padding: 0;
 +
            background-color: #F3F3F3;
 +
            font-size: 16px;
 +
            font-family: Arial, Verdana, Sans-serif;
 +
            letter-spacing: 0;
 +
            color: #FFFFFF;
 +
        }
 +
 
 +
        .daohang {
 +
            background-color: #323643;
 +
            position: relative;
 +
            color: #ffffff;
 +
            height: 64px;
 +
            top: -2px;
 +
        }
 +
 
 +
        .logo-daohang {
 +
            height: 64px;
 +
            left: 10%;
 +
            float: left;
 +
            position: relative;
 +
        }
 +
 
 +
        .daohang a {
 +
            display: block;
 +
            text-decoration: none;
 +
        }
 +
 
 +
        .daohang .shade {
 +
            position: absolute;
 +
            width: 100%;
 +
            height: 160px;
 +
            top: 64px;
 +
            left: 0;
 +
            z-index: 1;
 +
            background-color: #EEEEEE;
 +
            opacity: 0.96;
 +
            filter: alpha(opacity=96);
 +
            box-shadow: 0 5px 15px #CCCCCC;
 +
            display: none;
 +
            border-bottom: #ffffff solid 1px;
 +
            border-bottom: rgba(255, 255, 255, 0.3) solid 1px;
 +
        }
 +
 
 +
        .daohang .caidan {
 +
            position: absolute;
 +
            top: 0;
 +
            right: 10%;
 +
            margin: 0;
 +
            z-index: 2;
 +
            padding: 0;
 +
            list-style: none;
 +
            width: 730px;
 +
            float: right;
 +
            overflow: hidden;
 +
            height: 64px;
 +
        }
 +
 
 +
        .daohang .caidan>li {
 +
            padding: 0;
 +
            float: left;
 +
            margin: 0;
 +
            text-align: center;
 +
            height: 224px;
 +
        }
 +
 
 +
        .daohang .shortName {
 +
            width: 110px;
 +
        }
 +
 
 +
        .daohang .longName {
 +
            width: 170px;
 +
        }
 +
 
 +
        .daohang .nav_head {
 +
            height: 64px;
 +
            line-height: 64px;
 +
            color: #ffffff;
 +
            font-size: 16px !important;
 +
        }
 +
 
 +
        .daohang .xsjPic {
 +
            display: inline-block;
 +
            width: 10px;
 +
            height: 10px;
 +
            vertical-align: middle;
 +
            background-size: 100% 100%;
 +
            background-image: url("https://static.igem.org/mediawiki/2018/6/63/T--HZAU-China--xsj.svg")
 +
        }
 +
 
 +
        .daohang .xjtPic {
 +
            display: inline-block;
 +
            width: 10px;
 +
            height: 10px;
 +
            vertical-align: middle;
 +
            background-size: 100% 100%;
 +
            background-image: url("https://static.igem.org/mediawiki/2018/8/8d/T--HZAU-China--xjt.svg")
 +
        }
 +
 
 +
        .daohang a:hover span{
 +
            transform: rotateY(180deg);           
 +
            -webkit-transform: rotateY(180deg);           
 +
            -moz-transform: rotateY(180deg);           
 +
            -o-transform: rotateY(180deg);           
 +
            -ms-transform: rotateY(180deg);
 +
            transition: all 0.5s ease-in-out;           
 +
            -webkit-transition: all 0.5s ease-in-out;           
 +
            -moz-transition: all 0.5s ease-in-out;           
 +
            -o-transition: all 0.5s ease-in-out;
 +
        }
 +
 
 +
        .daohang .item {
 +
            font-size: 16px;
 +
            height: 40px;
 +
            line-height: 40px;
 +
            color: #333333;
 +
            position: relative;
 +
        }
 +
 
 +
        .daohang .caidan:hover {
 +
            height: 264px;
 +
            transition: height 0.3s;
 +
        }
 +
 
 +
        .daohang .caidan:hover+.shade {
 +
            display: block;
 +
        }
 +
 
 +
        .daohang .caidan>li.hiLight:hover {
 +
            background-color: #ffffff;
 +
        }
 +
 
 +
        .daohang .caidan>li:hover .nav_head {
 +
            background-color: #EA0D04;
 +
        }
 +
 
 +
        .daohang .caidan>li:hover .item {}
 +
 
 +
 
 +
        .daohang .shortName .item:before {
 +
            content: '';
 +
            display: block;
 +
            position: absolute;
 +
            width: 80px;
 +
            height: 1px;
 +
            bottom: 5px;
 +
            left: 15px;
 +
            background-color: #CCCCCC;
 +
        }
 +
 
 +
        .daohang .shortName .item:hover:after {
 +
            content: '';
 +
            display: block;
 +
            position: absolute;
 +
            width: 80px;
 +
            height: 2px;
 +
            bottom: 5px;
 +
            left: 15px;
 +
            background-color: #f51720;
 +
        }
 +
 
 +
        .daohang .longName .item:before {
 +
            content: '';
 +
            display: block;
 +
            position: absolute;
 +
            width: 130px;
 +
            height: 1px;
 +
            bottom: 5px;
 +
            left: 20px;
 +
            background-color: #CCCCCC;
 +
        }
 +
 
 +
        .daohang .longName .item:hover:after {
 +
            content: '';
 +
            display: block;
 +
            position: absolute;
 +
            width: 130px;
 +
            height: 2px;
 +
            bottom: 5px;
 +
            left: 20px;
 +
            background-color: #f51720;
 +
        }
 +
 
 +
        @media screen and (max-width: 1200px) {
 +
            .logo-daohang {
 +
                left: 3%;
 +
            }
 +
 
 +
            .daohangyi {
 +
                font-size: 12px;
 +
            }
 +
        }
 +
 
 +
        @media screen and (max-width: 880px) {
 +
 
 +
            .daohang .caidan {
 +
                right: 0;
 +
                width: 100%;
 +
            }
 +
 
 +
            .logo-daohang {
 +
                display: none;
 +
            }
 +
 
 +
            .daohang .shortName {
 +
                width: 15vw;
 +
            }
 +
 
 +
            .daohang .longName {
 +
                width: 25vw;
 +
            }
 +
 
 +
            .daohangyi img {
 +
                display: none;
 +
            }
 +
 
 +
            .daohang .longName .item:before {
 +
            width: 150px;
 +
            left: 20px;
 +
            }
 +
 
 +
            .daohang .longName .item:hover:after {
 +
            width: 150px;
 +
            left: 20px;
 +
          }
 +
        }
 +
    </style>
 +
    <!-- 内容CSS -->
 +
    <style class="text/css">
 +
        .clearfix:after {
 +
            content: ".";
 +
            display: block;
 +
            height: 0;
 +
            clear: both;
 +
            visibility: hidden;
 +
 
 +
        }
 +
 
 +
        .neirong {
 +
            width: 100%;
 +
            height: auto;
 +
            background-color: #F3F3F3;
 +
        }
 +
 
 +
        .zhengwen {
 +
            width: 80%;
 +
            /* height: auto; */
 +
            margin: 20px 20px 0 0;
 +
            /* right: 2%; */
 +
            /* top: 90px; */
 +
            padding: 20px 3%;
 +
            float: right;
 +
            /* position: relative; */
 +
            background-color: #FFF;
 +
            box-shadow: 0 1px 3px #676767;
 +
            /* border: 2px solid black; */
 +
            /* border-radius: 3px; */
 +
            /* overflow: hidden; */
 +
            /* display: block; */
 +
            /* font-family: Arial, Verdana, Sans-serif; */
 +
        }
 +
 
 +
        .cebian {
 +
            width: 15%;
 +
            /* height: 80vh; */
 +
            float: left;
 +
            /* left: 1vw; */
 +
            top: 150px;
 +
            position: fixed;
 +
            box-shadow: 0 1px 3px #676767;
 +
            /* border:2px solid black */
 +
            /* background-color: #323643 */
 +
        }
 +
 
 +
        .daimg {
 +
            width: 100%;
 +
            height: auto;
 +
            margin: 20px 0;
 +
            box-shadow: 0 1px 3px #676767;
 +
        }
 +
 
 +
        .h1 {
 +
            height: 100px;
 +
            line-height: 100px;
 +
            font-weight: bold;
 +
            font-family: 'Product Sans', sans-serif;
 +
            font-size: 50px;
 +
            color: black;
 +
            border-bottom: 3px solid black;
 +
            /* margin: 0 2.4%; */
 +
        }
 +
 
 +
        .zhengwen .tuandui_list {
 +
            position: relative;
 +
            margin-top: 40px;
 +
            height: 520px;
 +
            overflow: hidden;
 +
        }
 +
 
 +
        .tuandui_list>li {
 +
            padding: 0;
 +
            width: 20%;
 +
            float: left;
 +
            position: relative;
 +
            margin: 0 2.4%;
 +
            text-align: center;
 +
        }
 +
 
 +
        .zhengwen .laoshi_list {
 +
            position: relative;
 +
            margin-top: 40px;
 +
            height: 430px;
 +
        }
 +
 
 +
        .laoshi_list>li {
 +
            padding: 0;
 +
            width: 20%;
 +
            float: left;
 +
            position: relative;
 +
            margin: 0 2.4%;
 +
            text-align: center;
 +
        }
 +
 
 +
        .duiyuan {
 +
            margin: 20px 0;
 +
            /* border: 1px solid red; */
 +
        }
 +
 
 +
        .laoshi {
 +
            margin: 20px 0;
 +
        }
 +
 
 +
        .duiyuan img {
 +
            width: 100%;
 +
            height: auto;
 +
            border-top: 3px solid #323643;
 +
            border-left: 3px solid #323643;
 +
            border-right: 3px solid #323643;
 +
        }
 +
 
 +
        .laoshi img {
 +
            width: 100%;
 +
            height: 50vh;
 +
            border-top: 3px solid #323643;
 +
            border-left: 3px solid #323643;
 +
            border-right: 3px solid #323643;
 +
        }
 +
 
 +
        .duiyuan .xingming {
 +
            width: 100%;
 +
            height: 50px;
 +
            line-height: 50px;
 +
            background-color: #323643;
 +
            border-left: 3px solid #323643;
 +
            border-right: 3px solid #323643;
 +
            font-size: 16px;
 +
            color: white;
 +
            box-shadow: 0 1px 3px #CCCCCC;
 +
            font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
 +
            font-size: 24px;
 +
            font-weight: bold;
 +
            text-align: center;
 +
        }
 +
 
 +
        .laoshi .xingming {
 +
            width: 100%;
 +
            height: 50px;
 +
            line-height: 50px;
 +
            background-color: #323643;
 +
            border-left: 3px solid #323643;
 +
            border-right: 3px solid #323643;
 +
            font-size: 16px;
 +
            color: white;
 +
            box-shadow: 0 1px 3px #CCCCCC;
 +
            font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
 +
            font-size: 24px;
 +
            font-weight: bold;
 +
            text-align: center;
 +
        }
 +
 
 +
        .duiyuan .jieshao {
 +
            width: 100%;
 +
            height: 200px;
 +
            background-color: #f6eee0;
 +
            border-bottom: 3px solid #323643;
 +
            border-left: 3px solid #323643;
 +
            border-right: 3px solid #323643;
 +
            /* border-bottom-left-radius: 5px;
 +
            border-bottom-right-radius: 5px; */
 +
        }
 +
 
 +
        .duiyuan .jieshao .saohua {
 +
            padding: 10px 4px 0px 4px !important;
 +
            color: black;
 +
            font-family: Arial;
 +
            font-style: italic;
 +
            font-size: 15px !important;
 +
            list-style-type: none;
 +
            text-align: justify;
 +
            line-height: 18px;
 +
        }
 +
    </style>
 +
    <!-- 滚动菜单栏CSS -->
 +
    <style>
 +
        #float01 {}
 +
 
 +
        #float02 {}
  
 +
        #float03 {}
  
−
<div class="clear"></div>
+
        div.floatCtro {
 +
            width: 100%;
 +
            height: 250px;
 +
            margin: 0;
 +
            position: relative;
 +
            background: #fff;
  
 +
        }
  
 +
        .daohangyi {
 +
            display: block;
 +
            width: 100%;
 +
            height: 40px;
 +
            color: #ffffff !important;
 +
            font-size: 16px;
 +
            background-color: #323643;
 +
            border-bottom: 1px solid black;
 +
            /* border-radius: 5px; */
 +
            text-decoration: none !important;
 +
        }
  
−
<div class="column full_size">
+
        div.floatCtro .daohanger {
 +
            width: 100%;
 +
            text-align: justify !important;
 +
            height: 45px;
 +
            line-height: 45px;
 +
            font-family: Arial;
 +
            font-size: 14px;
 +
            color: #676767;
 +
            margin: 0;
 +
            padding-left: 8%;
 +
            cursor: pointer;
 +
            background: #fff;
 +
        }
  
−
<h1>Human Practices</h1>
+
        div.floatCtro a {
−
<p>
+
            display: inline-block;
−
At iGEM we believe societal considerations should be upfront and integrated throughout the design and execution of synthetic biology projects. “Human Practices” refers to iGEM teams’ efforts to actively consider how the world affects their work and the work affects the world. Through your Human Practices activities, your team should demonstrate how you have thought carefully and creatively about whether your project is responsible and good for the world. We invite you to explore issues relating (but not limited) to the ethics, safety, security, and sustainability of your project, and to show how this exploration feeds back into your project purpose, design and execution.
+
            display: none;
−
</p>
+
            width: 100%;
 +
            height: 40px;
 +
            /* margin: 10px 0 0 0; */
 +
            background: #FFF;
 +
            color: #000 !important;
 +
            vertical-align: middle;
 +
            cursor: pointer;
 +
        }
  
 +
        div.floatCtro a span {
 +
            display: block;
 +
            height: 44px;
 +
            line-height: 44px;
 +
            font-family: Arial;
 +
            font-size: 16px;
 +
            padding-left: 8%;
 +
        }
  
 +
        div.floatCtro a:hover {
 +
            /* background: #76b39d; */
 +
            color: #EA0D04 !important;
 +
            zoom: 1;
 +
        }
  
−
<p>For more information, please see the <a href="https://2018.igem.org/Human_Practices">Human Practices Hub</a>. There you will find:</p>
+
        /* .cebian a:hover {
−
+
            color: #f6eee0 !important;
−
<ul>
+
        } */
−
<li> an <a href="https://2018.igem.org/Human_Practices/Introduction">introduction</a> to Human Practices at iGEM </li>
+
−
<li>tips on <a href="https://2018.igem.org/Human_Practices/How_to_Succeed">how to succeed</a> including explanations of judging criteria and advice about how to conduct and document your Human Practices work</li>
+
−
<li>descriptions of <a href="https://2018.igem.org/Human_Practices/Examples">exemplary work</a> to inspire you</li>
+
−
<li>links to helpful <a href="https://2018.igem.org/Human_Practices/Resources">resources</a></li>
+
−
<li>And more! </li>
+
−
</ul>
+
−
+
  
 +
        div.floatCtro .daohanger:hover {
 +
            /* background: #76b39d; */
 +
            color: #1fa67a;
 +
            text-decoration: underline !important;
 +
        }
  
 +
        div.floatCtro .daohanger.cur {
 +
            /* background: #1fa67a; */
 +
            color: #1fa67a;
 +
        }
  
 +
        .biaoti {
 +
            line-height: 40px;
 +
            width: 50%;
 +
            margin-left: 6%;
 +
            text-align: center;
 +
            text-decoration: none !important;
 +
        }
  
−
<p>On this page, your team should document all of your Human Practices work and activities. You should write about the Human Practices topics you considered in your project, document any activities you conducted to explore these topics (such as engaging with experts and stakeholders), describe why you took a particular approach (including referencing any work you built upon), and explain if and how you integrated takeaways from your Human Practices work back into your project purpose, design and/or execution. </p>
+
        .daohangyi img {
−
+
            display: inline-block;
−
<p>If your team has gone above and beyond in work related to safety, then you should document this work on your Safety wiki page and provide a description and link on this page. If your team has developed education and public engagement efforts that go beyond a focus on your particular project, and for which would like to nominate your team for the Best Education and Public Engagement Special Prize, you should document this work on your Education and Education wiki page and provide a description and link here. </p>
+
            width: 12px;
−
</div>
+
            height: 12px;
−
+
            vertical-align: middle;
−
<div class="clear"></div>
+
            background-size: 100% 100%;
  
−
+
        }
−
<div class="column full_size">
+
        .cebian div:hover img{
−
<div class="highlight decoration_background">
+
            transform: rotateY(180deg);           
−
<p>The iGEM judges will review this page to assess whether you have met the Silver and/or Gold medal requirements based on the Integrated Human Practices criteria listed below. If you nominate your team for the <a href="https://2018.igem.org/Judging/Awards">Best Integrated Human Practices Special Prize</a> by filling out the corresponding field in the <a href="https://2018.igem.org/Judging/Judging_Form">judging form</a>, the judges will also review this page to consider your team for that prize.  
+
            -webkit-transform: rotateY(180deg);           
−
</p>
+
            -moz-transform: rotateY(180deg);           
−
</div>
+
            -o-transform: rotateY(180deg);           
−
</div>
+
            -ms-transform: rotateY(180deg);
 +
            transition: all 0.5s ease-in-out;           
 +
            -webkit-transition: all 0.5s ease-in-out;           
 +
            -moz-transition: all 0.5s ease-in-out;           
 +
            -o-transition: all 0.5s ease-in-out;
 +
        }
 +
        .cebian a:hover img{
 +
            transform: rotate(360deg);           
 +
            -webkit-transform: rotate(360deg);           
 +
            -moz-transform: rotate(360deg);           
 +
            -o-transform: rotate(360deg);           
 +
            -ms-transform: rotate(360deg);
 +
            transition: all 0.5s ease-in-out;           
 +
            -webkit-transition: all 0.5s ease-in-out;           
 +
            -moz-transition: all 0.5s ease-in-out;           
 +
            -o-transition: all 0.5s ease-in-out;
 +
        }
  
−
<div class="clear extra_space"></div>
+
        @media screen and (max-width: 1200px) {           
 +
         
 +
            .daohangyi {
 +
                font-size: 12px;
 +
            }
 +
        }
  
 +
        @media screen and (max-width: 880px) {
  
 +
            .daohangyi img {
 +
                display: none;
 +
            } 
  
−
<div class="column full_size">
+
            .laoshi img {
−
+
                height: 30vh;
−
<h3>Silver Medal Criterion #3</h3>
+
            }
−
<p>Convince the judges you have thought carefully and creatively about whether your work is responsible and good for the world. Document how you have investigated these issues and engaged with your relevant communities, why you chose this approach, and what you have learned. Please note that surveys will not fulfill this criteria unless you follow scientifically valid methods. </p>
+
        }
 +
    </style>
  
  
−
<h3>Gold Medal Criterion #1</h3>
+
</head>
−
<p>Expand on your silver medal activity by demonstrating how you have integrated the investigated issues into the purpose, design and/or execution of your project. Document how your project has changed based upon your human practices work.
+
−
</p>
+
−
</div>
+
  
 +
<body>
 +
    <!-- 导航栏 -->
 +
    <nav class="daohang">
 +
        <a href="https://2018.igem.org/Team:HZAU-China"><img src="https://static.igem.org/mediawiki/2018/7/75/T--HZAU-China--logo-nav.png"
 +
                class="logo-daohang"></a>
 +
        <ul class="caidan">
 +
            <li class="hiLight shortName">
 +
                <a class="nav_head" href="https://2018.igem.org/Team:HZAU-China">
 +
                    <span>Project</span>
 +
                    <span class="xsjPic"></span>
 +
                </a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Description">Description</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Design">Design</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Results">Results</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Demonstrate">Demonstrate</a>
 +
            </li>
 +
            <li class="hiLight shortName">
 +
                <a class="nav_head" href="#">
 +
                    <span>Wetlab</span>
 +
                    <span class="xjtPic"></span>
 +
                </a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Experiments">Experiments</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Improve">Improve</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/InterLab">InterLab</a>
 +
            </li>
 +
            <li class="hiLight shortName">
 +
                <a class="nav_head" href="#">
 +
                    <span>Drylab</span>
 +
                    <span class="xjtPic"></span>
 +
                </a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Model">Model</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Software">Software</a>
 +
            </li>
 +
            <li class="hiLight longName">
 +
                <a class="nav_head" href="#">
 +
                    <span>Human&nbsp;Practices</span>
 +
                    <span class="xjtPic"></span>
 +
                </a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Safety">Safty</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Human_Practices">Human Practices</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Public_Engagement">Public Engagement</a>
 +
            </li>
 +
            <li class="hiLight shortName">
 +
                <a class="nav_head" href="#">
 +
                    <span>About Us</span>
 +
                    <span class="xjtPic"></span>
 +
                </a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Team">Team</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Attributions">Attributions</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Collaborations">Collaborations</a>
 +
            </li>
 +
            <li class="shortName">
 +
                <a class="nav_head" href="https://2018.igem.org/Team:HZAU-China/Parts">
 +
                    <span>Parts</span>
 +
                </a>
 +
            </li>
 +
        </ul>
 +
        <div class="shade"></div>
 +
    </nav>
 +
    <!-- 内容 -->
 +
    <div class="neirong clearfix">
 +
        <!-- 正文 -->
 +
        <div class="zhengwen">
 +
            <img class="daimg" src="https://static.igem.org/mediawiki/2018/7/70/T--HZAU-China--hezhao1.png" alt="">
 +
            <div id="float01" class="cur">
 +
                <div class="h1">biaotiyi</div>
  
 +
            </div>
 +
            <div id="float02">
 +
                <div class="h1">biaotier</div>
  
−
<div class="clear extra_space"></div>
+
            </div>
 +
            <div id="float03">
 +
                <div class="h1">biaotisan</div>
 +
               
 +
            </div>
 +
        </div>
 +
        <!-- 侧边 -->
 +
        <div class="cebian">
 +
            <!-- 滚动菜单栏 -->
 +
            <a class="daohangyi" href="https://2018.igem.org/Team:HZAU-China/Safty">
 +
                <span class="biaoti">Safty</span>
 +
                <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/7/7c/T--HZAU-China--ysj.svg" alt=""></span>
 +
            </a>
 +
            <div class="daohangyi">
 +
                    <span class="biaoti">Human Practices</span>
 +
                    <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/8/8d/T--HZAU-China--xjt.svg" alt=""></span>
 +
            </div>
 +
            <div class="floatCtro">
 +
                <p class="daohanger">neirongyi</p>
 +
                <p class="daohanger">neironger</p>
 +
                <p class="daohanger">neirongsan</p>
 +
                <a>
 +
                    <span>Back&nbsp;to&nbsp;Top</span>
 +
                </a>
 +
            </div>
 +
            <a class="daohangyi" href="https://2018.igem.org/Team:HZAU-China/Public_Engagement">
 +
                <span class="biaoti">Public Engagement</span>
 +
                <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/7/7c/T--HZAU-China--ysj.svg" alt=""></span>
 +
            </a>
 +
            <!-- 滚动菜单栏 -->
 +
        </div>
 +
    </div>
  
 +
    <!-- 滚动菜单栏jQuery -->
 +
    <script src="jquery.js" type="text/javascript"></script>
 +
    <script>
 +
        $(function () {
 +
            var AllHet = $(window).height();
 +
            var mainHet = $('.floatCtro').height();
 +
            var fixedTop = (AllHet - mainHet) / 2
 +
            //  $('div.floatCtro').css({top:fixedTop+'px'});
 +
            $('div.floatCtro p').click(function () {
 +
                var ind = $('div.floatCtro p').index(this) + 1;
 +
                var topVal = $('#float0' + ind).offset().top;
 +
                $('body,html').animate({ scrollTop: topVal }, 1000)
 +
            })
 +
            $('div.floatCtro a').click(function () {
 +
                $('body,html').animate({ scrollTop: 0 }, 1000)
 +
            })
 +
            $(window).scroll(scrolls)
 +
            scrolls()
 +
            function scrolls() {
 +
                var f1, f2, f3, bck;
 +
                var fixRight = $('div.floatCtro p');
 +
                var blackTop = $('div.floatCtro a')
 +
                var sTop = $(window).scrollTop();
 +
                fl = $('#float01').offset().top;
 +
                f2 = $('#float02').offset().top;
 +
                f3 = $('#float03').offset().top;
  
 +
                if (sTop <= f2 - 100) {
 +
                    blackTop.fadeOut(300).css('display', 'none')
 +
                }
 +
                else {
 +
                    blackTop.fadeIn(300).css('display', 'block')
 +
                }
  
−
<div class="column full_size">
+
                if (sTop >= fl) {
−
<h3>Best Integrated Human Practices Special Prize</h3>
+
                    fixRight.eq(0).addClass('cur').siblings().removeClass('cur');
 +
                }
 +
                if (sTop >= f2 - 100) {
 +
                    fixRight.eq(1).addClass('cur').siblings().removeClass('cur');
 +
                }
 +
                if (sTop >= f3 - 100) {
 +
                    fixRight.eq(2).addClass('cur').siblings().removeClass('cur');
 +
                }
  
−
<p>To compete for the Best Integrated Human Practices prize, please describe your work on this page and also fill out the description on the judging form. </p>
+
            }
 +
        })
 +
    </script>
 +
    <!-- 滚动菜单栏jQuery -->
  
−
<p>How does your project affect society and how does society influence the direction of your project? How might ethical considerations and stakeholder input guide your project purpose and design and the experiments you conduct in the lab? How does this feedback enter into the process of your work all through the iGEM competition? Document a thoughtful and creative approach to exploring these questions and how your project evolved in the process to compete for this award!</p>
+
</body>
−
<p>You must also delete the message box on the top of this page to be eligible for this prize.</p>
+
  
−
</div>
+
</html>

Revision as of 22:35, 4 October 2018

biaotiyi
biaotier
biaotisan
Safty
Human Practices

neirongyi

neironger

neirongsan

Back to Top
Public Engagement