Difference between revisions of "Team:HZAU-China/Software"

 
(3 intermediate revisions by 2 users not shown)
Line 91: Line 91:
 
             z-index: 1;
 
             z-index: 1;
 
             background-color: #EEEEEE;
 
             background-color: #EEEEEE;
−
            opacity: 0.96;
 
−
            filter: alpha(opacity=96);
 
 
             box-shadow: 0 5px 15px #CCCCCC;
 
             box-shadow: 0 5px 15px #CCCCCC;
 
             display: none;
 
             display: none;
Line 154: Line 152:
 
         }
 
         }
  
−
         .daohang a:hover span{
+
         .daohang a:hover span {
−
             transform: rotateY(180deg);          
+
             transform: rotateY(180deg);
−
             -webkit-transform: rotateY(180deg);          
+
             -webkit-transform: rotateY(180deg);
−
             -moz-transform: rotateY(180deg);          
+
             -moz-transform: rotateY(180deg);
−
             -o-transform: rotateY(180deg);          
+
             -o-transform: rotateY(180deg);
 
             -ms-transform: rotateY(180deg);
 
             -ms-transform: rotateY(180deg);
−
             transition: all 0.5s ease-in-out;          
+
             transition: all 0.5s ease-in-out;
−
             -webkit-transition: all 0.5s ease-in-out;          
+
             -webkit-transition: all 0.5s ease-in-out;
−
             -moz-transition: all 0.5s ease-in-out;          
+
             -moz-transition: all 0.5s ease-in-out;
 
             -o-transition: all 0.5s ease-in-out;
 
             -o-transition: all 0.5s ease-in-out;
 
         }
 
         }
Line 244: Line 242:
  
 
             .daohangyi {
 
             .daohangyi {
−
                 font-size: 14px;
+
                 font-size: 12px;
 
             }
 
             }
 
         }
 
         }
  
−
         @media screen and (max-width: 880px) {
+
         @media screen and (max-width: 900px) {
  
 
             .daohang .caidan {
 
             .daohang .caidan {
Line 269: Line 267:
 
             .daohangyi img {
 
             .daohangyi img {
 
                 display: none;
 
                 display: none;
 +
            }
 +
 +
            .daohang .longName .item:before {
 +
                width: 150px;
 +
                left: 20px;
 +
            }
 +
 +
            .daohang .longName .item:hover:after {
 +
                width: 150px;
 +
                left: 20px;
 
             }
 
             }
 
         }
 
         }
Line 291: Line 299:
 
         .zhengwen {
 
         .zhengwen {
 
             width: 80%;
 
             width: 80%;
−
             /* height: auto; */
+
             margin: 60px auto;
−
            margin: 20px 20px 0 0;
+
             padding: 50px 3%;
−
            /* right: 2%; */
+
−
            /* top: 90px; */
+
−
             padding: 20px 3%;
+
−
            float: right;
+
−
            /* position: relative; */
+
 
             background-color: #FFF;
 
             background-color: #FFF;
 
             box-shadow: 0 1px 3px #676767;
 
             box-shadow: 0 1px 3px #676767;
−
            /* border: 2px solid black; */
+
 
−
            /* border-radius: 3px; */
+
−
            /* overflow: hidden; */
+
−
            /* display: block; */
+
−
            /* font-family: Arial, Verdana, Sans-serif; */
+
 
         }
 
         }
  
 
         .cebian {
 
         .cebian {
−
             width: 15%;
+
             width: 200px;
 
             /* height: 80vh; */
 
             /* height: 80vh; */
 
             float: left;
 
             float: left;
Line 317: Line 316:
 
             /* border:2px solid black */
 
             /* border:2px solid black */
 
             /* background-color: #323643 */
 
             /* background-color: #323643 */
 +
        }
 +
 +
        .zhengwen p{
 +
            text-align: justify !important;
 +
            font-family:  'Times New Roman',Helvetica,'Open Sans',  Arial, sans-serif !important;
 +
            color: #3B3B3B;
 +
            font-size: 26px !important;
 +
            padding-right: 20px;
 
         }
 
         }
  
Line 327: Line 334:
  
 
         .h1 {
 
         .h1 {
−
            height: 100px;
+
             line-height: 55px;
−
             line-height: 100px;
+
 
             font-weight: bold;
 
             font-weight: bold;
 +
            height:auto;
 
             font-family: 'Product Sans', sans-serif;
 
             font-family: 'Product Sans', sans-serif;
−
             font-size: 50px;
+
             font-size: 40px;
−
             color: black;
+
             color: #3B3B3B;
−
             border-bottom: 3px solid black;
+
             border-bottom: 2px solid #676767;
−
             /* margin: 0 2.4%; */
+
            margin-bottom: 20px;
 +
        }
 +
 
 +
        .h2 {
 +
            height: 40px;
 +
            line-height: 40px;
 +
            font-weight: bold;
 +
            height:auto;
 +
            /* font-weight: bold; */
 +
            font-family: 'Product Sans', sans-serif;
 +
            font-size: 30px;
 +
            color: #484848;
 +
             /* margin-bottom: 20px; */
 +
        }
 +
 
 +
        .h3 {
 +
            height: 30px;
 +
            line-height: 30px;
 +
            font-weight: bold;
 +
            height:auto;
 +
            /* font-weight: bold; */
 +
            font-family: 'Product Sans', sans-serif;
 +
            font-size: 24px;
 +
            color: #484848;
 +
            /* margin-bottom: 20px; */
 +
        }
 +
       
 +
        table {
 +
            color: #3B3B3B;
 
         }
 
         }
  
Line 445: Line 480:
 
             text-align: justify;
 
             text-align: justify;
 
             line-height: 18px;
 
             line-height: 18px;
−
        }
 
−
    </style>
 
−
    <!-- 滚动菜单栏CSS -->
 
−
    <style>
 
−
        #float01 {}
 
−
 
−
        #float02 {}
 
−
 
−
        #float03 {}
 
−
 
−
        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.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;
 
−
        }
 
−
 
−
        div.floatCtro a {
 
−
            display: inline-block;
 
−
            display: none;
 
−
            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;
 
−
        }
 
−
 
−
        /* .cebian a:hover {
 
−
            color: #f6eee0 !important;
 
−
        } */
 
−
 
−
        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;
 
−
        }
 
−
 
−
        .daohangyi img {
 
−
            display: inline-block;
 
−
            width: 12px;
 
−
            height: 12px;
 
−
            vertical-align: middle;
 
−
            background-size: 100% 100%;
 
−
 
−
        }
 
−
        .cebian div:hover img{
 
−
            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;
 
−
        }
 
−
        .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;
 
−
        }
 
−
 
−
        @media screen and (max-width: 1000px) {           
 
−
         
 
−
            .daohangyi {
 
−
                font-size: 14px;
 
−
            }
 
−
        }
 
−
 
−
        @media screen and (max-width: 880px) {
 
−
 
−
            .daohangyi img {
 
−
                display: none;
 
−
            } 
 
−
           
 
−
            .laoshi img {
 
−
                height: 30vh;
 
−
            }
 
 
         }
 
         }
 
     </style>
 
     </style>
Line 617: Line 510:
 
                 <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/Improve">Improve</a>
 
                 <a class="item" href="https://2018.igem.org/Team:HZAU-China/InterLab">InterLab</a>
 
                 <a class="item" href="https://2018.igem.org/Team:HZAU-China/InterLab">InterLab</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Notebook">Notebook</a>
 +
 
             </li>
 
             </li>
 
             <li class="hiLight shortName">
 
             <li class="hiLight shortName">
Line 631: Line 526:
 
                     <span class="xjtPic"></span>
 
                     <span class="xjtPic"></span>
 
                 </a>
 
                 </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/Safety">Safety</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/Human_Practices">Human Practices</a>
 
                 <a class="item" href="https://2018.igem.org/Team:HZAU-China/Public_Engagement">Public Engagement</a>
 
                 <a class="item" href="https://2018.igem.org/Team:HZAU-China/Public_Engagement">Public Engagement</a>
Line 644: Line 539:
 
                 <a class="item" href="https://2018.igem.org/Team:HZAU-China/Collaborations">Collaborations</a>
 
                 <a class="item" href="https://2018.igem.org/Team:HZAU-China/Collaborations">Collaborations</a>
 
             </li>
 
             </li>
−
             <li class="shortName">
+
             <li class="hiLight shortName">
−
                 <a class="nav_head" href="https://2018.igem.org/Team:HZAU-China/Parts">
+
                 <a class="nav_head" href="#">
 
                     <span>Parts</span>
 
                     <span>Parts</span>
 +
                    <span class="xjtPic"></span>
 
                 </a>
 
                 </a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Basic_Part">Basic</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Composite_Part">Composite</a>
 
             </li>
 
             </li>
 
         </ul>
 
         </ul>
Line 656: Line 554:
 
         <!-- 正文 -->
 
         <!-- 正文 -->
 
         <div class="zhengwen">
 
         <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 id="float01" class="cur">
−
                 <div class="h1">biaotiyi</div>
+
                 <div class="h1">Salmonella infection prediction tool</div>
−
 
+
                <p>For individual culture: predict infection time to reduce the experimental error in tumor cell
 +
                    culture experiment.<br>
 +
                    For mixed culture: predict infection time to easier see the experimental results.<br>
 +
                    <a href="https://github.com/cccoolll/Pyroptosis.git">https://github.com/cccoolll/Pyroptosis.git</a>
 +
                </p>
 +
                <div class="h1">ATc modelling software</div>
 +
                <p>A GUI App based on MATLAB to acquire a model of ATc induced gene circuit.<br>
 +
                    <a href="https://github.com/tom13amy/atc_modelling_software">https://github.com/tom13amy/atc_modelling_software</a>
 +
                </p>
 
             </div>
 
             </div>
−
            <div id="float02">
+
        </div>
−
                <div class="h1">biaotier</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/Model">
 
−
                <span class="biaoti">Model</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">Software</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>
 
−
            <div class="daohangyi" style="height:20px">
 
−
                </div>
 
−
            <!-- 滚动菜单栏 -->
 
−
        </div>
 
 
     </div>
 
     </div>
  
 
     <!-- 滚动菜单栏jQuery -->
 
     <!-- 滚动菜单栏jQuery -->
 
     <script src="jquery.js" type="text/javascript"></script>
 
     <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')
 
−
                }
 
−
 
−
                if (sTop >= fl) {
 
−
                    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');
 
−
                }
 
−
 
−
            }
 
−
        })
 
−
    </script>
 
 
     <!-- 滚动菜单栏jQuery -->
 
     <!-- 滚动菜单栏jQuery -->
  

Latest revision as of 03:16, 18 October 2018

Salmonella infection prediction tool

For individual culture: predict infection time to reduce the experimental error in tumor cell culture experiment.
For mixed culture: predict infection time to easier see the experimental results.
https://github.com/cccoolll/Pyroptosis.git

ATc modelling software

A GUI App based on MATLAB to acquire a model of ATc induced gene circuit.
https://github.com/tom13amy/atc_modelling_software