Difference between revisions of "Team:SCUT-China A"

Line 1: Line 1:
 
<html>
 
<html>
 +
<style type="text/css">
 +
.jquery-accordion-menu, .jquery-accordion-menu * {
 +
font-family: "微软雅黑";
 +
box-sizing: border-box;
 +
-moz-box-sizing: border-box;
 +
-webkit-box-sizing: border-box;
 +
outline: 0
 +
}
 +
.jquery-accordion-menu {
 +
min-width: 178px;
 +
float: left;
 +
position: relative;
 +
box-shadow: 2px 0 10px #333
 +
}
 +
.jquery-accordion-menu .jquery-accordion-menu-footer, .jquery-accordion-menu .jquery-accordion-menu-header {
 +
width: 100%;
 +
height: 50px;
 +
padding-left: 22px;
 +
float: left;
 +
line-height: 50px;
 +
font-weight: 600;
 +
color: #f0f0f0;
 +
background: #414956;
 +
}
 +
.jquery-accordion-menu ul {
 +
margin: 0;
 +
padding: 0;
 +
list-style: none
 +
}
 +
.jquery-accordion-menu ul li {
 +
width: 100%;
 +
display: block;
 +
float: left;
 +
position: relative
 +
}
 +
.jquery-accordion-menu ul li a {
 +
width: 100%;
 +
padding: 14px 22px;
 +
float: left;
 +
text-decoration: none;
 +
color: #f0f0f0;
 +
font-size: 13px;
 +
background: #414956;
 +
white-space: nowrap;
 +
position: relative;
 +
overflow: hidden;
 +
-o-transition: color .2s linear, background .2s linear;
 +
-moz-transition: color .2s linear, background .2s linear;
 +
-webkit-transition: color .2s linear, background .2s linear;
 +
transition: color .2s linear, background .2s linear
 +
}
 +
.jquery-accordion-menu>ul>li.active>a, .jquery-accordion-menu>ul>li:hover>a {
 +
color: #fff;
 +
background: #3b424d
 +
}
 +
.jquery-accordion-menu>ul>li>a {
 +
border-bottom: solid 1px #3b424d
 +
}
 +
.jquery-accordion-menu ul li a i {
 +
width: 34px;
 +
float: left;
 +
line-height: 18px;
 +
font-size: 16px;
 +
text-align: left
 +
}
 +
.jquery-accordion-menu .submenu-indicator {
 +
float: right;
 +
right: 22px;
 +
position: absolute;
 +
line-height: 19px;
 +
font-size: 20px;
 +
-o-transition: transform .3s linear;
 +
-moz-transition: transform .3s linear;
 +
-webkit-transition: transform .3s linear;
 +
-ms-transition: transform .3s linear
 +
}
 +
.jquery-accordion-menu ul ul.submenu .submenu-indicator {
 +
line-height: 16px
 +
}
 +
.jquery-accordion-menu .submenu-indicator-minus>.submenu-indicator {
 +
-ms-transform: rotate(45deg);
 +
-moz-transform: rotate(45deg);
 +
-webkit-transform: rotate(45deg);
 +
transform: rotate(45deg)
 +
}
 +
.jquery-accordion-menu ul ul.submenu, .jquery-accordion-menu ul ul.submenu li ul.submenu {
 +
width: 100%;
 +
display: none;
 +
position: static
 +
}
 +
.jquery-accordion-menu ul ul.submenu li {
 +
clear: both;
 +
width: 100%
 +
}
 +
.jquery-accordion-menu ul ul.submenu li a {
 +
width: 100%;
 +
float: left;
 +
font-size: 11px;
 +
background: #383838;
 +
border-top: none;
 +
position: relative;
 +
border-left: solid 6px transparent;
 +
-o-transition: border .2s linear;
 +
-moz-transition: border .2s linear;
 +
-webkit-transition: border .2s linear;
 +
transition: border .2s linear
 +
}
 +
/*******test***************/
  
−
<link href="//2016.igem.org/Template:SCUT-China_A/jqamcss?action=raw&ctype=text/css" rel="stylesheet" type="text/css" />
+
 
 +
 
 +
/*******test***************/
 +
.jquery-accordion-menu ul ul.submenu li:hover>a {
 +
border-left-color: #414956
 +
}
 +
.jquery-accordion-menu ul ul.submenu>li>a {
 +
padding-left: 30px
 +
}
 +
.jquery-accordion-menu ul ul.submenu>li>ul.submenu>li>a {
 +
padding-left: 45px
 +
}
 +
.jquery-accordion-menu ul ul.submenu>li>ul.submenu>li>ul.submenu>li>a {
 +
padding-left: 60px
 +
}
 +
.jquery-accordion-menu ul li .jquery-accordion-menu-label, .jquery-accordion-menu ul ul.submenu li .jquery-accordion-menu-label {
 +
min-width: 20px;
 +
padding: 1px 2px 1px 1px;
 +
position: absolute;
 +
right: 18px;
 +
top: 14px;
 +
font-size: 11px;
 +
font-weight: 800;
 +
color: #555;
 +
text-align: center;
 +
line-height: 18px;
 +
background: #f0f0f0;
 +
border-radius: 100%
 +
}
 +
.jquery-accordion-menu ul ul.submenu li .jquery-accordion-menu-label {
 +
top: 12px
 +
}
 +
.ink {
 +
display: block;
 +
position: absolute;
 +
background: rgba(255,255,255,.3);
 +
border-radius: 100%;
 +
-webkit-transform: scale(0);
 +
-moz-transform: scale(0);
 +
-ms-transform: scale(0);
 +
-o-transform: scale(0);
 +
transform: scale(0)
 +
}
 +
.animate-ink {
 +
-webkit-animation: ripple .5s linear;
 +
-moz-animation: ripple .5s linear;
 +
-ms-animation: ripple .5s linear;
 +
-o-animation: ripple .5s linear;
 +
animation: ripple .5s linear
 +
}
 +
@-webkit-keyframes ripple {
 +
100% {
 +
opacity: 0;
 +
-webkit-transform: scale(2.5)
 +
}
 +
}
 +
@-moz-keyframes ripple {
 +
100% {
 +
opacity: 0;
 +
-moz-transform: scale(2.5)
 +
}
 +
}
 +
@-o-keyframes ripple {
 +
100% {
 +
opacity: 0;
 +
-o-transform: scale(2.5)
 +
}
 +
}
 +
@keyframes ripple {
 +
100% {
 +
opacity: 0;
 +
transform: scale(2.5)
 +
}
 +
}
 +
.blue.jquery-accordion-menu .jquery-accordion-menu-footer, .blue.jquery-accordion-menu .jquery-accordion-menu-header, .blue.jquery-accordion-menu ul li a {
 +
background: #4A89DC
 +
}
 +
.blue.jquery-accordion-menu>ul>li.active>a, .blue.jquery-accordion-menu>ul>li:hover>a {
 +
background: #3e82da
 +
}
 +
.blue.jquery-accordion-menu>ul>li>a {
 +
border-bottom-color: #3e82da
 +
}
 +
.blue.jquery-accordion-menu ul ul.submenu li:hover>a {
 +
border-left-color: #3e82da
 +
}
 +
.green.jquery-accordion-menu .jquery-accordion-menu-footer, .green.jquery-accordion-menu .jquery-accordion-menu-header, .green.jquery-accordion-menu ul li a {
 +
background: #03A678
 +
}
 +
.green.jquery-accordion-menu>ul>li.active>a, .green.jquery-accordion-menu>ul>li:hover>a {
 +
background: #049372
 +
}
 +
.green.jquery-accordion-menu>ul>li>a {
 +
border-bottom-color: #049372
 +
}
 +
.green.jquery-accordion-menu ul ul.submenu li:hover>a {
 +
border-left-color: #049372
 +
}
 +
.red.jquery-accordion-menu .jquery-accordion-menu-footer, .red.jquery-accordion-menu .jquery-accordion-menu-header, .red.jquery-accordion-menu ul li a {
 +
background: #0F0F0F
 +
}
 +
.red.jquery-accordion-menu>ul>li.active>a, .red.jquery-accordion-menu>ul>li:hover>a {
 +
background: #F60
 +
}
 +
.red.jquery-accordion-menu>ul>li>a {
 +
border-bottom-color: #F60
 +
}
 +
.red.jquery-accordion-menu ul ul.submenu li:hover>a {
 +
border-left-color: #F60
 +
}
 +
.white.jquery-accordion-menu .jquery-accordion-menu-footer, .white.jquery-accordion-menu .jquery-accordion-menu-header, .white.jquery-accordion-menu ul li a {
 +
background: #fff;
 +
color: #555
 +
}
 +
.white.jquery-accordion-menu>ul>li.active>a, .white.jquery-accordion-menu>ul>li:hover>a {
 +
background: #f0f0f0
 +
}
 +
.white.jquery-accordion-menu>ul>li>a {
 +
border-bottom-color: #f0f0f0
 +
}
 +
.white.jquery-accordion-menu ul ul.submenu li:hover>a {
 +
border-left-color: #f0f0f0
 +
}
 +
.white.jquery-accordion-menu ul ul.submenu li a {
 +
color: #f0f0f0
 +
}
 +
.white.jquery-accordion-menu>ul>li>a>.ink {
 +
background: rgba(0,0,0,.1)
 +
}
 +
.black.jquery-accordion-menu .jquery-accordion-menu-footer, .black.jquery-accordion-menu .jquery-accordion-menu-header, .black.jquery-accordion-menu ul li a {
 +
background: #292929
 +
}
 +
.black.jquery-accordion-menu>ul>li.active>a, .black.jquery-accordion-menu>ul>li:hover>a {
 +
background: #222
 +
}
 +
.black.jquery-accordion-menu>ul>li>a {
 +
border-bottom-color: #222
 +
}
 +
.black.jquery-accordion-menu ul ul.submenu li:hover>a {
 +
border-left-color: #222
 +
}
 +
</style>
 
<script type="text/javascript">
 
<script type="text/javascript">
  
Line 207: Line 456:
  
 
</style>
 
</style>
−
 
 
<script src="//2016.igem.org/Template:SCUT-China_A/jqam?
 
<script src="//2016.igem.org/Template:SCUT-China_A/jqam?
 
action=raw&ctype=text/javascript" type="text/javascript"></script>
 
action=raw&ctype=text/javascript" type="text/javascript"></script>
Line 227: Line 475:
 
<body>
 
<body>
  
−
<!-- <div id="bodybg">   
+
<!-- <div id="bodybg">   
 
<img src="../kkkk/images/565605c511367_1024.jpg" alt="" class="stretch"/></div>-->
 
<img src="../kkkk/images/565605c511367_1024.jpg" alt="" class="stretch"/></div>-->
  
 
<div class="container">
 
<div class="container">
−
    <div class="header">
+
  <div class="header"> <a href="#"> <img src="/wiki/images/6/64/T--SCUT-China_A--title-logo.png" width="182" height="142" style="background: #050505; display:block; color: #D6D6D6;"/> </a> </div>
−
        <a href="#">
+
  <!-- end .header -->
−
            <img src="/wiki/images/6/64/T--SCUT-China_A--title-logo.png" width="182" height="142" style="background: #050505; display:block; color: #D6D6D6;"/>
+
  <div class="sidebar1 box " style="width:178px;">
−
        </a>  
+
    <div id="jquery-accordion-menu" class="jquery-accordion-menu red">
−
    </div><!-- end .header -->
+
      <div class="jquery-accordion-menu-header" id="form"></div>
−
    <div class="sidebar1 box " style="width:178px;">
+
      <ul id="demo-list">
−
        <div id="jquery-accordion-menu" class="jquery-accordion-menu red">
+
        <li class="active"><a href="#">Home </a></li>
−
            <div class="jquery-accordion-menu-header" id="form"></div>
+
        <li> <a href="#">Team </a>
−
            <ul id="demo-list">
+
          <ul class="submenu">
−
                <li class="active"><a href="#">Home </a></li>
+
            <li><a href="#">Team </a></li>
−
                <li>
+
            <li> <a href="#">Collaborations </a> <span class="jquery-accordion-menu-label">10 </span> </li>
−
                    <a href="#">Team </a>
+
          </ul>
−
                    <ul class="submenu">
+
        </li>
−
                        <li><a href="#">Team </a></li>
+
        <li> <a href="#">Project </a>
−
                        <li>
+
          <ul class="submenu">
−
                            <a href="#">Collaborations </a>
+
            <li><a href="#">Description </a></li>
−
                            <span class="jquery-accordion-menu-label">10 </span>
+
            <li> <a href="#">Collaborations </a> <span class="jquery-accordion-menu-label">10 </span> </li>
−
                        </li>
+
            <li><a href="#">Design </a></li>
−
                    </ul>
+
            <li><a href="#">Experiments </a></li>
−
                </li>
+
            <li><a href="#">Proof of Concept </a></li>
−
                <li>
+
            <li><a href="#">Demonstrate </a></li>
−
                    <a href="#">Project </a>
+
            <li><a href="#">Results </a></li>
−
                        <ul class="submenu">
+
            <li><a href="#">Notebook </a></li>
−
                            <li><a href="#">Description </a></li>
+
          </ul>
−
                            <li>
+
        </li>
−
                                <a href="#">Collaborations </a>
+
        <li> <a href="#">Parts </a>
−
                                <span class="jquery-accordion-menu-label">10 </span>
+
          <ul class="submenu">
−
                            </li>
+
            <li><a href="#">Parts </a></li>
−
                            <li><a href="#">Design </a></li>
+
            <li><a href="#">Basic Parts </a></li>
−
                            <li><a href="#">Experiments </a></li>
+
            <li> <a href="#">Composite Parts </a>
−
                            <li><a href="#">Proof of Concept </a></li>
+
              <ul class="submenu">
−
                            <li><a href="#">Demonstrate </a></li>
+
                <li><a href="#">1 </a></li>
−
                            <li><a href="#">Results </a></li>
+
                <li><a href="#">2 </a></li>
−
                            <li><a href="#">Notebook </a></li>
+
                <li><a href="#">3 </a></li>
−
                        </ul>
+
                <li><a href="#">4 </a></li>
−
                </li>
+
              </ul>
−
                <li>
+
            </li>
−
                    <a href="#">Parts </a>
+
            <li><a href="#">Part Collection </a></li>
−
                    <ul class="submenu">
+
          </ul>
−
                        <li><a href="#">Parts </a></li>
+
        </li>
−
                        <li><a href="#">Basic Parts </a></li>
+
        <li><a href="#">Safety </a></li>
−
                        <li>
+
        <li><a href="#">Attributions </a>
−
                            <a href="#">Composite Parts </a>
+
        <li> <a href="#">Human Practices </a>
−
                            <ul class="submenu">
+
          <ul class="submenu">
−
                                <li><a href="#">1 </a></li>
+
            <li><a href="#">Human Practices </a></li>
−
                                <li><a href="#">2 </a></li>
+
            <li> <a href="#">Silver </a> <span class="jquery-accordion-menu-label">10 </span> </li>
−
                                <li><a href="#">3 </a></li>
+
            <li><a href="#">Gold </a></li>
−
                                <li><a href="#">4 </a></li>
+
            <li><a href="#">Integrated Practices </a></li>
−
                            </ul>
+
            <li><a href="#">Engagement </a></li>
−
                        </li>
+
          </ul>
−
                        <li><a href="#">Part Collection </a></li>
+
        </li>
−
                    </ul>
+
        <li> <a href="#">Awards </a>
−
                </li>
+
          <ul class="submenu">
−
                <li><a href="#">Safety </a></li>
+
            <li><a href="#">Entrepreneurship </a></li>
−
                <li><a href="#">Attributions </a>
+
            <li> <a href="#">Hardware </a> <span class="jquery-accordion-menu-label">10 </span> </li>
−
                <li>
+
            <li><a href="#">Software </a></li>
−
                    <a href="#">Human Practices </a>
+
            <li><a href="#">Measurement </a></li>
−
                    <ul class="submenu">
+
            <li><a href="#">Model </a></li>
−
                        <li><a href="#">Human Practices </a></li>
+
          </ul>
−
                        <li>
+
        </li>
−
                            <a href="#">Silver </a>
+
      </ul>
−
                            <span class="jquery-accordion-menu-label">10 </span>
+
    </div>
−
                        </li>
+
  </div>
−
                        <li><a href="#">Gold </a></li>
+
  <div> </div>
−
                        <li><a href="#">Integrated Practices </a></li>
+
  <!-- end .sidebar1 -->  
−
                        <li><a href="#">Engagement </a></li>
+
  <script type="text/javascript">
−
                    </ul>
+
−
                </li>
+
−
                <li>
+
−
                    <a href="#">Awards </a>
+
−
                    <ul class="submenu">
+
−
                        <li><a href="#">Entrepreneurship </a></li>
+
−
                        <li>
+
−
                            <a href="#">Hardware </a>
+
−
                            <span class="jquery-accordion-menu-label">10 </span>
+
−
                        </li>
+
−
                        <li><a href="#">Software </a></li>
+
−
                        <li><a href="#">Measurement </a></li>
+
−
                        <li><a href="#">Model </a></li>
+
−
                    </ul>
+
−
                </li>
+
−
            </ul>
+
−
        </div>
+
−
        </div>
+
−
    <div>
+
−
    </div><!-- end .sidebar1 -->
+
−
    <script type="text/javascript">
+
 
         (function($) {
 
         (function($) {
 
             $.expr[":"].Contains = function(a, i, m) {
 
             $.expr[":"].Contains = function(a, i, m) {
Line 352: Line 579:
 
             });
 
             });
 
         })(jQuery);
 
         })(jQuery);
−
     </script>
+
     </script>  
−
<!--------------------------------------------------------------->
+
  <!--------------------------------------------------------------->
−
 
+
 
−
    <div class="content box"  style="width:900px; float:right; border:0px;" >
+
  <div class="content box"  style="width:900px; float:right; border:0px;" >  
−
        <!-- 正文内容写在这里面 -->
+
    <!-- 正文内容写在这里面 -->  
−
    </div><!-- end .content -->
+
  </div>
−
 
+
  <!-- end .content -->
−
    <div id="footer"  class="footer">
+
 
−
        <table style="text-align:center; font-size:12px;width:1080px;">
+
  <div id="footer"  class="footer">
−
            <tr>
+
    <table style="text-align:center; font-size:12px;width:1080px;">
−
                <th width="25%"><a href="#">Contact Us</a></th>
+
      <tr>
−
                <th width="25%"><a href="#">wow</a></th>
+
        <th width="25%"><a href="#">Contact Us</a></th>
−
                <th width="25%"><a href="#">Help Desk</a></th>
+
        <th width="25%"><a href="#">wow</a></th>
−
                <th width="25%"><a href="#">Contributors</a></th>
+
        <th width="25%"><a href="#">Help Desk</a></th>
−
            </tr>
+
        <th width="25%"><a href="#">Contributors</a></th>
−
           
+
      </tr>
−
        </table>
+
    </table>
−
    </div><!-- end .footer -->
+
  </div>
−
</div><!-- end .container -->
+
  <!-- end .footer -->  
 +
</div>
 +
<!-- end .container -->
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 12:43, 13 September 2016