Template:Team:Marburg/Template:HeaderMenu

From 2014.igem.org

(Difference between revisions)

Revision as of 14:12, 7 October 2014

slider2_container {

position: relative;
width: 600px;
height: 300px;
margin: 0px auto;
border: 10px solid #FFF;
box-shadow: 2px 7px 5px #888;
top:-35px;

} .menu {display:block; padding:0; margin:0; height:42px; position:relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; -ms-touch-action: none; } .menu img {position:absolute; left:0px; top:34px; z-index:100; display:none;} .menu.first img, .menu.second img {top:14px;} .menu ul {padding:0; margin:0; margin-top: 25px; padding-top: 25px;} .menu ul li {display:inline-block; position:relative;background: url('https://static.igem.org/mediawiki/2014/0/0d/Mr_navigation_general.png');} .menu ul li {*display:inline; z-index: 1;} .menu ul li a {display:block; font:normal 15pt/40px 'Muli', arial, sans-serif; color:#444; text-decoration:none; padding:0 18px; text-align:center;} .menu ul li a:hover {color:#a00;} .menu ul li.current a {color:#c00; z-index:100;} .menu ul li.current b {display:block; width:100%; height:40px; position:absolute;; top:0; left:0; background:url(trans.gif);} .menu.center {text-align:center;} .menu.right {text-align:right;}

.menu.first { z-index: 120; } .menu ul li.current a {color:#c00; z-index:120;}

@media only screen and (max-width:1200px) { .menu {width:235px;} .menu.center {margin:0 auto; text-align:left;} .menu.right {margin:0 0 0 auto; text-align:left;} .menu img {display:block;} .menu ul li {display:block; margin-bottom:-40px; -webkit-transition:0.5s; -moz-transition:0.5s; -o-transition:0.5s; transition:0.5s; } .menu ul li:last-child {margin-bottom:0;} .menu ul li.current {display:block; z-index:10;} .menu:hover ul li {margin-bottom:0;}

#slider2_container { top:-0; border: none; }

} @media only screen and (max-device-width:1024px) and (orientation:portrait) { .menu {width:235px;} .menu.center {margin:0 auto; text-align:left;} .menu.right {margin:0 0 0 auto; text-align:left;} .menu img {display:block;} .menu ul li {display:block; margin-bottom:-40px; -webkit-transition:0.5s; -moz-transition:0.5s; -o-transition:0.5s; transition:0.5s; } .menu ul li:last-child {margin-bottom:0;} .menu ul li.current {display:block; z-index:10;} .menu:hover ul li {margin-bottom:0;}

#slider2_container { top:0; border: none; }

} @media only screen and (max-device-width:480px) { .menu {width:235px;} .menu.center {margin:0 auto; text-align:left;} .menu.right {margin:0 0 0 auto; text-align:left;} .menu img {display:block;} .menu ul li {display:block; margin-bottom:-40px; -webkit-transition:0.5s; -moz-transition:0.5s; -o-transition:0.5s; transition:0.5s; } .menu ul li:last-child {margin-bottom:0;} .menu ul li.current {display:block; z-index:10;} .menu:hover ul li {margin-bottom:0;}

#slider2_container { top:0; border: none; }

}

.menu ul li.current a.a {

 color: #C00;

} .menu ul li a.a: hover {

 color: #A00 !important;

} .menu ul li.current a.b {

 color: #00668d;

} .menu ul li a.b:hover {

 color: #004b67 !important;

} .menu ul li.current a.c {

 color: #e77235;

} .menu ul li a.c:hover {

 color: #cb5f25 !important;

} .menu ul li.current a.d {

 color: #339209;

} .menu ul li a.d:hover {

 color: #256c06 !important;

}

.menu ul li.current a.e {
 color: #43969f;

} .menu ul li a.e:hover {

 color: #26585e !important;

} .menu ul li a.f:hover {

 color: #ad8d06 !important;

} .menu ul li.current a.f {

   color: #cda80e !important;

}

navbox {

background: url('https://static.igem.org/mediawiki/2014/b/bc/Mr_logo_surf.png');
background-repeat: no-repeat;
margin: 0 auto;
min-width: 500px;
max-width: 1080px;
width: 85%;
text-align: center;

}

.menu {

 height: 100px;

}

.menu.first, .menu.second {

 height: 50px;

}

.menu ul.second {

 padding-top: 0;
 margin: 0 auto;

}

.menu ul.first li {

 background: url('https://static.igem.org/mediawiki/2014/7/75/Mr-navigation-first.png');

}

.menu ul.second li {

 background: url('https://static.igem.org/mediawiki/2014/1/1a/Mr-navigation-second.png');

}

.menu.first, .menu.second {

 height: 50px;

}

.menu.second ul li a {

 font: 13pt/40px "Muli",arial,sans-serif;

}

.menu.first ul, .menu.second ul {

 padding-top: 0px;

}

@@ Line 1: / Line 1: @@
-<html>
+#slider2_container {
+ position: relative;
-<script>
+ width: 600px;
-$(window).load(function(){
+ height: 300px;
-/* test for @media-query support */
+ margin: 0px auto;
-$('body').append($('<div id="test-media-query">').css({visibility: 'hidden', position: 'absolute'}));
+ border: 10px solid #FFF;
-$('head').prepend('<style type="text/css" media="only all" id="test-media-query-style">');
+ box-shadow: 2px 7px 5px #888;
-styleSht = document.styleSheets[0];
+ top:-35px;
-if (styleSht.cssRules || styleSht.rules) {
-	if (styleSht.insertRule) {styleSht.insertRule('#test-media-query {display:none !important;}', styleSht.cssRules.length);
-	} else if (styleSht.addRule) {styleSht.addRule('#test-media-query', 'display:none');}
 }
-mediaQuery = $('#test-media-query').css('display') === 'none';
-$('#test-media-query, #test-media-query-style').remove();
-/* if (!mediaQuery) {
-	$(window).on("resize", function () {
-		widthDoc = $(window).width();
-		if (!$('link[href="responsive-single/size880.css"]').length && widthDoc<=1024){$("<link>").appendTo($('head')).attr({type:'text/css',rel:'stylesheet',href:'https://2014.igem.org/Template:Team:Marburg/Template:Header:ResponsiveCSS?action=render'});}
-		if (widthDoc>1024) {$('link[href="https://2014.igem.org/Template:Team:Marburg/Template:Header:ResponsiveCSS?action=render"]').remove();}
-	}).resize();
-} */
-});
-</script>
-<style>
 .menu {display:block; padding:0; margin:0; height:42px; position:relative;
 -webkit-user-select: none;
@@ Line 37: / Line 17: @@
 }
 .menu img {position:absolute; left:0px; top:34px; z-index:100; display:none;}
 .menu.first img, .menu.second img {top:14px;}
 .menu ul {padding:0; margin:0; margin-top: 25px;   padding-top: 25px;}
 .menu ul li {display:inline-block; position:relative;background: url('https://static.igem.org/mediawiki/2014/0/0d/Mr_navigation_general.png');}
-.menu ul li {*display:inline;}
+.menu ul li {*display:inline; z-index: 1;}
 .menu ul li a {display:block; font:normal 15pt/40px 'Muli', arial, sans-serif; color:#444; text-decoration:none; padding:0 18px; text-align:center;}
 .menu ul li a:hover {color:#a00;}
@@ Line 66: / Line 45: @@
 .menu ul li.current {display:block; z-index:10;}
 .menu:hover ul li {margin-bottom:0;}
+ #slider2_container { top:-0; border: none; }
 }
 @media only screen and (max-device-width:1024px) and (orientation:portrait) {
@@ Line 81: / Line 61: @@
 .menu ul li.current {display:block; z-index:10;}
 .menu:hover ul li {margin-bottom:0;}
+ #slider2_container { top:0; border: none; }
 }
 @media only screen and (max-device-width:480px) {
@@ Line 96: / Line 77: @@
 .menu ul li.current {display:block; z-index:10;}
 .menu:hover ul li {margin-bottom:0;}
+ #slider2_container { top:0; border: none; }
 }
@@ Line 178: / Line 160: @@
    padding-top: 0px;
 }
-</style>
-</html>