|
|
Line 214: |
Line 214: |
| */ | | */ |
| | | |
− | #bg_menu {
| |
− | margin-top: 18px;
| |
− | display: block;
| |
− | background-color: rgba(65,4,1,1.00);
| |
− | position: fixed;
| |
− | text-align: center;
| |
− | bottom: 85px;
| |
− | right: 10%;
| |
− | z-index: 999;
| |
− | line-height: 57px;
| |
− | width: 60px;
| |
− | height: 60px;
| |
− | }
| |
− | #bg_menu #menu_0 {
| |
− | margin-top: 18px;
| |
− | display: none;
| |
− | /* [disabled]background-color: gold; */
| |
− | position: absolute;
| |
− | text-align: center;
| |
− | line-height: 50px;
| |
− | z-index: 999;
| |
− | height: 500px;
| |
− | width: 700px;
| |
− | bottom: 0px;
| |
− | right: 0px;
| |
− | transform-origin: 100% 100% 0;
| |
− | transform: scale(0,0);
| |
− | transition: .3s ease;
| |
− | }
| |
− | #bg_menu #menu_1 {
| |
− | width: 200px;
| |
− | position: absolute;
| |
− | left: 0px;
| |
− | bottom: 0px;
| |
− | background-color: rgba(65,4,3,1.00);
| |
− | height: 100%;
| |
− | display: block;
| |
− | transform: translate(200px,0px);
| |
− | transition: .5s ease;
| |
− | }
| |
− | #bg_menu #menu_2 {
| |
− | width: 500px;
| |
− | position: absolute;
| |
− | bottom: 0px;
| |
− | background-color: rgba(205,205,205,1.00);
| |
− | height: 100%;
| |
− | right: 0px;
| |
− | }
| |
− | #menu_0 #menu_2 #menu_2_title_0 {
| |
− | width: 500px;
| |
− | position: relative;
| |
− | background-color: rgba(107,47,255,1.00);
| |
− | height: 50px;
| |
− | }
| |
− | #menu_2 #menu_2_title_0 #m_2_t_0_0 {
| |
− | width: 50%;
| |
− | position: absolute;
| |
− | left: 0px;
| |
− | height: 100%;
| |
− | background-color: rgba(255,255,255,1.00);
| |
− | top: 0px;
| |
− | }
| |
− | .menu_inner_block {
| |
− | cursor: pointer;
| |
− | font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
| |
− | color: rgba(255,134,0,1.00);
| |
− | }
| |
− |
| |
− | #menu_2 #menu_2_title_0 #m_2_t_0_1 {
| |
− | width: 50%;
| |
− | position: absolute;
| |
− | height: 100%;
| |
− | background-color: rgba(65,4,3,1.00);
| |
− | right: 0px;
| |
− | top: 0px;
| |
− | }
| |
− |
| |
− | #menu_0 #menu_2 #menu_2_block_0 {
| |
− | background-color: hsla(44,100%,80%,1.00);
| |
− | width: 500px;
| |
− | position: relative;
| |
− | height: 210px;
| |
− | }
| |
− | .menulink {
| |
− | color: hsla(1,94%,13%,1.00);
| |
− | font-size: 21px;
| |
− | border-width: thin;
| |
− | border-style: solid none none;
| |
− | }
| |
− |
| |
− |
| |
− | #menu_0 #menu_2 #menu_2_title_1 {
| |
− | width: 500px;
| |
− | position: relative;
| |
− | background-color: rgba(255,255,255,1.00);
| |
− | height: 50px;
| |
− | font-size: 18px;
| |
− | }
| |
− |
| |
− | #menu_0 #menu_2 #menu_2_block_1 {
| |
− | background-color: rgba(255,228,153,1.00);
| |
− | width: 500px;
| |
− | position: relative;
| |
− | height: 130px;
| |
− | }
| |
− | #menu_0 #menu_2 #menu_2_title_2 {
| |
− | width: 500px;
| |
− | position: relative;
| |
− | background-color: rgba(65,187,147,1.00);
| |
− | height: 60px;
| |
− | }
| |
− | #menu_2 #menu_2_title_2 #m_2_t_2_0 {
| |
− | width: 440px;
| |
− | height: 60px;
| |
− | background-color: rgba(255,255,255,1.00);
| |
− | position: absolute;
| |
− | bottom: 0px;
| |
− | font-size: 30px;
| |
− | line-height: 60px;
| |
− | left: 0px;
| |
− | }
| |
− | #menu_2 #menu_2_title_2 #m_2_t_2_1 {
| |
− | width: 60px;
| |
− | height: 60px;
| |
− | background-color: rgba(0,0,0,1.00);
| |
− | position: absolute;
| |
− | right: 0px;
| |
− | bottom: 0px;
| |
− | font-size: 30px;
| |
− | line-height: 60px;
| |
− | }
| |
− |
| |
− | #m_2_t_2_1 span {
| |
− | width: 60px;
| |
− | height: 60px;
| |
− | display: block;
| |
− | }
| |
− |
| |
− |
| |
− |
| |
− |
| |
− |
| |
− |
| |
− |
| |
− |
| |
− |
| |
− | /**
| |
− | *第一部分
| |
− | */
| |
− | #first_s{
| |
− | padding-left: 0;
| |
− | padding-right: 0;
| |
− | background-color: #fff;
| |
− | margin: 0;
| |
− | height: 0px;
| |
− | z-index: 999;
| |
− | position: relative;
| |
− | color: rgba(255,255,255,1.00);
| |
− | width: 100%;
| |
− | }
| |
− |
| |
− |
| |
− | #first_s #nav_bg{
| |
− | height: 80px;
| |
− | color: rgba(255,255,255,1.00);
| |
− | transition: 0.5s;
| |
− | }
| |
− | #first_s .container {
| |
− | height: 80px;
| |
− | color: rgba(255,255,255,1.00);
| |
− | }
| |
− | #first_s .container .navbar-header {
| |
− | height: 80px;
| |
− | float: left;
| |
− | }
| |
− | #first_s .container .navbar-brand {
| |
− | font-size: 24px;
| |
− | line-height: 72px;
| |
− | color: rgba(65,4,3,1.00);
| |
− | }
| |
− | #first_s .container ul {
| |
− | padding: 0 0;
| |
− | margin: 0 0;
| |
− | height: 80px;
| |
− | float: right;
| |
− | font-size: 18px;
| |
− | color: #FFFFFF;
| |
− | }
| |
− | #first_s .container a {
| |
− | padding: 0 0;
| |
− | margin: 0 0;
| |
− | height: 80px;
| |
− | font-size: 18px;
| |
− | color: #410403;
| |
− | font-weight: bold;
| |
− | }
| |
− |
| |
− |
| |
− | #first_s .container li
| |
− | {
| |
− | width: 116px;
| |
− | list-style: none;
| |
− | height: 80px;
| |
− | line-height: 80px;
| |
− | float: left;
| |
− | color: #CC992C;
| |
− | text-align: center;
| |
− | position: relative;
| |
− | }
| |
− | #first_s .container li ul a
| |
− | {
| |
− | color: #CC992C;
| |
− | font-weight: normal;
| |
− |
| |
− | }
| |
− |
| |
− |
| |
− |
| |
− | #first_s .container li ul
| |
− | {
| |
− | list-style: none;
| |
− | padding-left: 0;
| |
− | text-align: center;
| |
− | position: absolute;
| |
− | display: none;
| |
− | height: auto;
| |
− | color: #CC992C;
| |
− | }
| |
− |
| |
− | /*#first_s .container li:hover > ul
| |
− | {
| |
− | display: block;
| |
− | }*/
| |
− |
| |
− |
| |
− | #first_s .container li ul li
| |
− | {
| |
− | height: 45px;
| |
− | padding-top: 0px;
| |
− | padding-bottom: 0px;
| |
− | line-height: 53px;
| |
− | position: absolute;
| |
− | background-color: rgba(0,0,0,1.00);
| |
− | top: 0px;
| |
− | opacity: 0;
| |
− | color: #CC992C;
| |
− | }
| |
− |
| |
− | #first_s .container li ul li ul
| |
− | { width: 100%;
| |
− | position: absolute;
| |
− | left:100%;
| |
− | top:0;
| |
− | display: none;
| |
− | }
| |
− | #first_s .container li ul li li
| |
− | {
| |
− | height: 45px;
| |
− | line-height: 53px;
| |
− | padding-top: 0px;
| |
− | padding-bottom: 0px;
| |
− | position: absolute;
| |
− | background-color: rgba(0,0,0,1.00);
| |
− | opacity: 0;
| |
− |
| |
− | }
| |
− | /*
| |
− | 菜单按钮部分
| |
− | */
| |
− | #second_s{
| |
− | height: 700px;
| |
− | background-position: center center;
| |
− | position: relative;
| |
− | background-image: url(https://static.igem.org/mediawiki/2019/c/c1/T--Jilin_China--Home--Banner--0.png);
| |
− | background-size: cover;
| |
− | background-repeat: no-repeat;
| |
− | }
| |
− |
| |
− | #third_s {
| |
− | height: 824px;
| |
− | position: relative;
| |
− | padding: 00;
| |
− | background-color: rgba(255,255,255,1.00);
| |
− | }
| |
− | #third_s #third_1 {
| |
− | height: 810px;
| |
− | background-color: rgba(255,255,255,1.00);
| |
− | padding: 00;
| |
− | position: relative;
| |
− | }
| |
− | #third_s #third_1 #third_1_1 {
| |
− | background-color: rgba(253,234,201,1.00);
| |
− | position: absolute;
| |
− | margin: 0 0;
| |
− | width: 75%;
| |
− | top: -37px;
| |
− | }
| |
− | #zhuan {
| |
− | margin-top: 18px;
| |
− | display: none;
| |
− | width: 10%;
| |
− | height: 60px;
| |
− | background-color: gold;
| |
− | position: fixed;
| |
− | max-width: 60px;
| |
− | max-height: 60px;
| |
− | min-width: 30px;
| |
− | min-height: 30px;
| |
− | text-align: center;
| |
− | line-height: 50px;
| |
− | bottom: 45px;
| |
− | right: 215px;
| |
− | }
| |
− |
| |
− |
| |
− | </style>
| |
− |
| |
− |
| |
− | <div id="bg_menu" class="menu_inner_block">menu
| |
− | <div class="menu_inner_block" id="menu_0">
| |
− | <div class="menu_inner_block" id="menu_1">
| |
− | This piece is for the wonderful moments.
| |
− | </div>
| |
− | <div class="menu_inner_block" id="menu_2">
| |
− | <div class="menu_inner_block" id="menu_2_title_0">
| |
− | <div class="menu_inner_block" id="m_2_t_0_0">Jilin_China</div>
| |
− | <div class="menu_inner_block" id="m_2_t_0_1">Main menu</div>
| |
− | </div>
| |
− | <div class="menu_inner_block" id="menu_2_block_0">
| |
− | <div class="menulink"><a href="https://2019.igem.org/Team:Jilin_China/Description">Description</a></div>
| |
− | <div class="menulink">More are developing!</div>
| |
− | <div class="menulink">More are developing!</div>
| |
− | </div>
| |
− | <div class="menu_inner_block" id="menu_2_title_1">Maybe you are srceahing for this!</div>
| |
− | <div class="menu_inner_block" id="menu_2_block_1"></div>
| |
− | <div class="menu_inner_block" id="menu_2_title_2">
| |
− | <div class="menu_inner_block" id="m_2_t_2_0"></div>
| |
− | <div class="menu_inner_block" id="m_2_t_2_1"><span id="menu_cha">×</span></div>
| |
− |
| |
− |
| |
− | </div>
| |
− |
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− |
| |
| | | |
| | | |
Line 614: |
Line 268: |
| <script src="https://2019.igem.org/wiki/index.php?title=Template:Jilin_China/tool.js&action=raw&ctype=text/javascript"></script> | | <script src="https://2019.igem.org/wiki/index.php?title=Template:Jilin_China/tool.js&action=raw&ctype=text/javascript"></script> |
| <script src="https://2019.igem.org/wiki/index.php?title=Template:Jilin_China/renderTP.js&action=raw&ctype=text/javascript"></script> | | <script src="https://2019.igem.org/wiki/index.php?title=Template:Jilin_China/renderTP.js&action=raw&ctype=text/javascript"></script> |
− | <script>
| |
− | if(document.body.clientWidth<=991){
| |
− | $$("third_1_1").style.width=100+"%";
| |
− | $$("third_1_1").style.left=0+"px";
| |
− | }
| |
− | if(document.body.clientWidth>991){
| |
− | $$("third_1_1").style.width=75+"%";
| |
− | $$("third_1_1").style.left=0+"px";
| |
− | }
| |
| | | |
− | </script>
| |
| | | |
| | | |
| </html> | | </html> |