Team:HNU China/Team
From 2014.igem.org
(Difference between revisions)
Yannickchou (Talk | contribs) |
|||
Line 51: | Line 51: | ||
width: 900px; | width: 900px; | ||
margin: auto; | margin: auto; | ||
- | min-height: | + | min-height: 1; |
height: auto; | height: auto; | ||
} | } | ||
Line 70: | Line 70: | ||
} | } | ||
#chead{ | #chead{ | ||
- | + | ||
height:91px; | height:91px; | ||
background:url('https://static.igem.org/mediawiki/2014/0/08/Chead.png') no-repeat center; | background:url('https://static.igem.org/mediawiki/2014/0/08/Chead.png') no-repeat center; | ||
Line 83: | Line 83: | ||
} | } | ||
+ | .wrapper { | ||
+ | width:850px; | ||
+ | margin:auto; | ||
+ | } | ||
+ | .mbTabset .handler { | ||
+ | padding-right:5px; | ||
+ | position:relative; | ||
+ | margin-left:-5px | ||
+ | } | ||
+ | .mbTabset { | ||
+ | white-space:nowrap; | ||
+ | display:block; | ||
+ | margin-left:20px; | ||
+ | margin-right:20px; | ||
+ | margin-bottom:-1px; | ||
+ | float:left; | ||
+ | position:relative | ||
+ | } | ||
+ | .mbTabset .mbTab { | ||
+ | display:inline-block; | ||
+ | cursor:pointer; | ||
+ | min-width:100px | ||
+ | } | ||
+ | .mbTabset .mbTab.disabled { | ||
+ | cursor:default | ||
+ | } | ||
+ | .mbTabset.right { | ||
+ | float:right | ||
+ | } | ||
+ | .mbTabset .mbTab i { | ||
+ | width:25px; | ||
+ | position:relative; | ||
+ | margin-left:-7px; | ||
+ | padding-right:5px; | ||
+ | margin-right:8px; | ||
+ | cursor:move | ||
+ | } | ||
+ | .mbTabset .floatEl { | ||
+ | float:left; | ||
+ | } | ||
+ | .mbTabset a.mbTab { | ||
+ | background-color:transparent; | ||
+ | background-image: url( 'https://static.igem.org/mediawiki/2014/7/7b/Tab_right.png' ); | ||
+ | background-repeat:no-repeat; | ||
+ | background-position:top right; | ||
+ | color: #666; | ||
+ | display:block; /*opera*/ | ||
+ | display:inline-block; /*ie*/ | ||
+ | font: normal 13px arial, sans-serif; | ||
+ | height: 28px; | ||
+ | margin-right: 0; | ||
+ | padding-right: 33px; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | .mbTabset a.mbTab span.sortable { | ||
+ | background-color:transparent; | ||
+ | background-image: url( 'https://static.igem.org/mediawiki/2014/e/e0/Tab_grep.png' ); | ||
+ | background-repeat:no-repeat; | ||
+ | display: block; | ||
+ | line-height: 21px; | ||
+ | padding: 3px 0 4px 10px; | ||
+ | } | ||
+ | .mbTabset a.mbTab span img { | ||
+ | margin-left:-5px; | ||
+ | margin-top:-2px; | ||
+ | padding-right:5px; | ||
+ | } | ||
+ | /*HOVER*/ | ||
+ | .mbTabset a.mbTab:hover { | ||
+ | background-image: url( 'https://static.igem.org/mediawiki/2014/3/36/Tab_right_hover.png' ); | ||
+ | color: #000; | ||
+ | outline: none; | ||
+ | } | ||
+ | .mbTabset a.mbTab:hover span.sortable { | ||
+ | background-image:url( 'https://static.igem.org/mediawiki/2014/2/27/Tab_hover_grep.png'); | ||
+ | } | ||
+ | /*SELECTED*/ | ||
+ | .mbTabset a.mbTab.sel { | ||
+ | background-image: url( 'https://static.igem.org/mediawiki/2014/8/88/Tab_right_sel.png' ); | ||
+ | color: #000; | ||
+ | outline: none; | ||
+ | } | ||
+ | .mbTabset a.mbTab.sel span.sortable { | ||
+ | background-image:url( 'https://static.igem.org/mediawiki/2014/5/5b/Tab_sel_grep.png'); | ||
+ | } | ||
+ | /*DISABLED*/ | ||
+ | .mbTabset a.mbTab.disabled { | ||
+ | background-image: url( 'https://static.igem.org/mediawiki/2014/7/7b/Tab_right.png' ); | ||
+ | color: #999; | ||
+ | outline: none; | ||
+ | } | ||
+ | .mbTabset a.mbTab.disabled span.sortable { | ||
+ | background-image:url( 'https://static.igem.org/mediawiki/2014/e/e0/Tab_grep.png'); | ||
+ | } | ||
+ | /*CONTAINER*/ | ||
+ | |||
+ | .mbTabsetContainer { | ||
+ | clear:both; | ||
+ | } | ||
+ | .tabContent { | ||
+ | padding:0px; | ||
+ | } | ||
</style> | </style> | ||
+ | <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> | ||
+ | <script type="text/javascript" src="http://xtms.info/js/ui.core.min.js"></script> | ||
+ | <script type="text/javascript" src="http://xtms.info/js/ui.sortable.min.js"></script> | ||
+ | <script type="text/javascript" src="http://xtms.info/js/jquery.metadata.js"></script> | ||
+ | <script type="text/javascript" src="http://xtms.info/js/mbTabset.js"></script> | ||
+ | <script type="text/javascript"> | ||
+ | $(function(){ | ||
+ | $("#tabset1").buildMbTabset({ | ||
+ | stop:function(){if ($("#array").is(":checked")) alert($.mbTabset.mbTabsetArray)}, | ||
+ | sortable:true | ||
+ | }); | ||
+ | $("#tabset2").buildMbTabset({ | ||
+ | stop:function(){if ($("#array").is(":checked")) alert($.mbTabset.mbTabsetArray)}, | ||
+ | sortable:false, | ||
+ | position:"left" | ||
+ | }); | ||
+ | //$("#b").selectMbTab(); | ||
+ | }); | ||
+ | var ajaxUrl="content_2.html"; | ||
+ | var ajaxD="pippo=1&pluto=2"; | ||
+ | |||
+ | </script> | ||
</head> | </head> | ||
<body> | <body> | ||
+ | |||
<div id="menu"> | <div id="menu"> | ||
<ul> | <ul> | ||
Line 131: | Line 256: | ||
</ul> | </ul> | ||
</div> | </div> | ||
+ | <div class="wrapper"> | ||
+ | <div class="tabset" id="tabset1"><a id="a" class="tab sel {content:'cont_1'}">team1</a><a id="b" class="tab {content:'cont_2'}">team2</a><a id="c" class="tab {content:'cont_3'}">team3</a><a id="d" class="tab {content:'cont_4'}" >team4</a><a id="a" class="tab {content:'cont_5'}" >team5</a></div> | ||
+ | <div id="cont_1"> | ||
+ | <div id="chead"></div> | ||
+ | <div id="cmiddle">project1<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>长度测试</div> | ||
+ | <div id="cfoot"></div> | ||
+ | </div> | ||
+ | <div id="cont_2"> | ||
+ | <div id="chead"></div> | ||
+ | <div id="cmiddle">2</div> | ||
+ | <div id="cfoot"></div> | ||
+ | </div> | ||
+ | |||
+ | <div id="cont_3"> | ||
+ | <div id="chead"></div> | ||
+ | <div id="cmiddle">3</div> | ||
+ | <div id="cfoot"></div> | ||
+ | </div> | ||
+ | <div id="cont_4"> | ||
+ | <div id="chead"></div> | ||
+ | <div id="cmiddle">4</div> | ||
+ | <div id="cfoot"></div> | ||
+ | </div> | ||
+ | <div id="cont_5"> | ||
<div id="chead"></div> | <div id="chead"></div> | ||
- | <div id="cmiddle"> | + | <div id="cmiddle">5</div> |
<div id="cfoot"></div> | <div id="cfoot"></div> | ||
+ | </div> | ||
+ | </div> | ||
</body> | </body> | ||
</html> | </html> |
Revision as of 09:02, 24 July 2014