Template:Team:Bonn
From 2013.igem.org
(Difference between revisions)
(Created page with "<html> this is my template! </html>") |
|||
Line 1: | Line 1: | ||
- | < | + | <script> |
- | + | function rollout(id) | |
- | </ | + | { |
+ | var hover; | ||
+ | hover = document.getElementById(id).childNodes; | ||
+ | for(var i=0, ii = hover.length; i < ii; i++) { | ||
+ | if(hover[i].nodeName == "DIV"){ if(hover[i].className == "content-box-text") { | ||
+ | $('#'+hover[i].id).stop().animate(); | ||
+ | $('#'+hover[i].id).animate({height:'300px'},1000); | ||
+ | var hover2; | ||
+ | hover2 = document.getElementById(hover[i].id).childNodes; | ||
+ | for(var a=0, aa = hover2.length; a < aa; a++) { | ||
+ | if(hover2[a].nodeName == "SPAN"){ | ||
+ | if(hover2[a].className == "content-box-hover") { | ||
+ | $('#'+hover2[a].id).stop().animate(); | ||
+ | $('#'+hover2[a].id).animate({opacity:1},500); | ||
+ | } | ||
+ | if(hover2[a].className == "content-box-more") { | ||
+ | $('#'+hover2[a].id).stop().animate(); | ||
+ | $('#'+hover2[a].id).animate({opacity:0},500); | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | }} | ||
+ | if(hover[i].nodeName == "DIV"){ if(hover[i].className == "content-box-sidemenu-left" || hover[i].className == "content-box-sidemenu-right") { | ||
+ | $('#'+hover[i].id).stop().animate(); | ||
+ | $('#'+hover[i].id).animate({width:50},500); | ||
+ | }} | ||
+ | } | ||
+ | $('#'+id).stop().animate(); | ||
+ | $('#'+id).animate({height:'300px'},500); | ||
+ | } | ||
+ | function rollin(id) | ||
+ | { | ||
+ | var hover; | ||
+ | hover = document.getElementById(id).childNodes; | ||
+ | for(var i=0, ii = hover.length; i < ii; i++) { | ||
+ | if(hover[i].nodeName == "DIV"){ if(hover[i].className == "content-box-text") { | ||
+ | $('#'+hover[i].id).stop().animate(); | ||
+ | $('#'+hover[i].id).animate({height:'200px'},1000); | ||
+ | var hover2; | ||
+ | hover2 = document.getElementById(hover[i].id).childNodes; | ||
+ | for(var a=0, aa = hover2.length; a < aa; a++) { | ||
+ | if(hover2[a].nodeName == "SPAN"){ | ||
+ | if(hover2[a].className == "content-box-more") { | ||
+ | $('#'+hover2[a].id).stop().animate(); | ||
+ | $('#'+hover2[a].id).animate({opacity:1},500); | ||
+ | } | ||
+ | if(hover2[a].className == "content-box-hover") { | ||
+ | $('#'+hover2[a].id).stop().animate(); | ||
+ | $('#'+hover2[a].id).animate({opacity:0},500); | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | }} | ||
+ | if(hover[i].nodeName == "DIV"){ if(hover[i].className == "content-box-sidemenu-left" || hover[i].className == "content-box-sidemenu-right") { | ||
+ | $('#'+hover[i].id).stop().animate(); | ||
+ | $('#'+hover[i].id).animate({width:00},500); | ||
+ | }} | ||
+ | } | ||
+ | $('#'+id).stop().animate(); | ||
+ | $('#'+id).animate({height:'200px'},500); | ||
+ | document.getElementById(id).style.fontWeight = "normal"; | ||
+ | } | ||
+ | function fadein() | ||
+ | { | ||
+ | $('.menu-button').animate({height:'20px'},500); | ||
+ | } | ||
+ | function fadeout() | ||
+ | { | ||
+ | $('.menu-button').stop().animate(); | ||
+ | $('.menu-button').animate({height:'0px'},500); | ||
+ | $('.menu-button').fadeOut(1); | ||
+ | } | ||
+ | </script> | ||
+ | </head> | ||
+ | <style type="text/css"> | ||
+ | #page{ | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | } | ||
+ | #menu{ | ||
+ | color:#000000; | ||
+ | margin:0 auto; | ||
+ | border-width: 5px 0 0 0; | ||
+ | border-style:solid; | ||
+ | border-color:black; | ||
+ | padding: 0 0 1px 0; | ||
+ | width:900px; | ||
+ | height:50px; | ||
+ | } | ||
+ | #menu a{ | ||
+ | color:#000000; | ||
+ | padding: 5px; | ||
+ | } | ||
+ | .menu-button{ | ||
+ | float:left; | ||
+ | margin-right: 10px; | ||
+ | font-size: 15px; | ||
+ | background-color:grey; | ||
+ | text-weight:bold; | ||
+ | } | ||
+ | #content { | ||
+ | margin:0 auto; | ||
+ | padding:0; | ||
+ | } | ||
+ | #content-top{ | ||
+ | <!-- border-style:solid; | ||
+ | border-width:1px; --> | ||
+ | width:690px; | ||
+ | height:100px; | ||
+ | margin:0 auto; | ||
+ | font-size:14px; | ||
+ | text-align: center; | ||
+ | } | ||
+ | .content-box-more{ | ||
+ | font-weight:normal; | ||
+ | } | ||
+ | .content-row{ | ||
+ | <!-- border-style:solid; | ||
+ | border-width:1px; --> | ||
+ | padding:20px; | ||
+ | height:340px; | ||
+ | margin:0 auto; | ||
+ | align:center; | ||
+ | width:800px; | ||
+ | } | ||
+ | .content-box{ | ||
+ | float:left; | ||
+ | height:200px; | ||
+ | border-style:solid; | ||
+ | border-width:1px; | ||
+ | color:#ffffff; | ||
+ | margin:0 20px 0 20px; | ||
+ | text-align:center; | ||
+ | border-radius:10px; | ||
+ | opacity:0.75; | ||
+ | font-weight:normal; | ||
+ | width:350px; | ||
+ | } | ||
+ | .content-box-sidemenu-right{ | ||
+ | float:right; | ||
+ | width:0px; | ||
+ | background-color:black; | ||
+ | height:200px; | ||
+ | } | ||
+ | .content-box-sidemenu-left{ | ||
+ | float:left; | ||
+ | width:0px; | ||
+ | background-color:black; | ||
+ | height:200px; | ||
+ | } | ||
+ | .content-box-text{ | ||
+ | float:left; | ||
+ | width:300px; | ||
+ | background-color:grey; | ||
+ | height:200px; | ||
+ | opacity:1; | ||
+ | } | ||
+ | .content-box-hover{ | ||
+ | margin:0 auto; | ||
+ | padding:10px; | ||
+ | opacity:0; | ||
+ | } | ||
+ | .content-box-more{ | ||
+ | color:#ffffff; | ||
+ | } | ||
+ | .mw-headline{ | ||
+ | color:#ffffff; | ||
+ | } | ||
+ | .editsection{ | ||
+ | color:#ffffff; | ||
+ | } | ||
+ | </style> |
Revision as of 17:39, 19 April 2013
<script> function rollout(id) {
var hover; hover = document.getElementById(id).childNodes; for(var i=0, ii = hover.length; i < ii; i++) { if(hover[i].nodeName == "DIV"){ if(hover[i].className == "content-box-text") { $('#'+hover[i].id).stop().animate(); $('#'+hover[i].id).animate({height:'300px'},1000); var hover2; hover2 = document.getElementById(hover[i].id).childNodes; for(var a=0, aa = hover2.length; a < aa; a++) { if(hover2[a].nodeName == "SPAN"){ if(hover2[a].className == "content-box-hover") { $('#'+hover2[a].id).stop().animate(); $('#'+hover2[a].id).animate({opacity:1},500); } if(hover2[a].className == "content-box-more") { $('#'+hover2[a].id).stop().animate(); $('#'+hover2[a].id).animate({opacity:0},500); } } } }} if(hover[i].nodeName == "DIV"){ if(hover[i].className == "content-box-sidemenu-left" || hover[i].className == "content-box-sidemenu-right") { $('#'+hover[i].id).stop().animate(); $('#'+hover[i].id).animate({width:50},500); }} } $('#'+id).stop().animate(); $('#'+id).animate({height:'300px'},500);
} function rollin(id) {
var hover; hover = document.getElementById(id).childNodes; for(var i=0, ii = hover.length; i < ii; i++) { if(hover[i].nodeName == "DIV"){ if(hover[i].className == "content-box-text") { $('#'+hover[i].id).stop().animate(); $('#'+hover[i].id).animate({height:'200px'},1000); var hover2; hover2 = document.getElementById(hover[i].id).childNodes; for(var a=0, aa = hover2.length; a < aa; a++) { if(hover2[a].nodeName == "SPAN"){ if(hover2[a].className == "content-box-more") { $('#'+hover2[a].id).stop().animate(); $('#'+hover2[a].id).animate({opacity:1},500); } if(hover2[a].className == "content-box-hover") { $('#'+hover2[a].id).stop().animate(); $('#'+hover2[a].id).animate({opacity:0},500); } } } }} if(hover[i].nodeName == "DIV"){ if(hover[i].className == "content-box-sidemenu-left" || hover[i].className == "content-box-sidemenu-right") { $('#'+hover[i].id).stop().animate(); $('#'+hover[i].id).animate({width:00},500); }} } $('#'+id).stop().animate(); $('#'+id).animate({height:'200px'},500); document.getElementById(id).style.fontWeight = "normal";
} function fadein() {
$('.menu-button').animate({height:'20px'},500);
} function fadeout() {
$('.menu-button').stop().animate(); $('.menu-button').animate({height:'0px'},500); $('.menu-button').fadeOut(1);
} </script> </head> <style type="text/css">
- page{
margin:0; padding:0;
}
- menu{
color:#000000; margin:0 auto; border-width: 5px 0 0 0; border-style:solid; border-color:black; padding: 0 0 1px 0; width:900px; height:50px;
}
- menu a{
color:#000000; padding: 5px;
} .menu-button{
float:left; margin-right: 10px; font-size: 15px; background-color:grey; text-weight:bold;
}
- content {
margin:0 auto; padding:0;
}
- content-top{
width:690px; height:100px; margin:0 auto; font-size:14px; text-align: center;
} .content-box-more{
font-weight:normal;
} .content-row{
padding:20px; height:340px; margin:0 auto; align:center; width:800px;
} .content-box{
float:left; height:200px; border-style:solid; border-width:1px; color:#ffffff; margin:0 20px 0 20px; text-align:center; border-radius:10px; opacity:0.75; font-weight:normal; width:350px;
} .content-box-sidemenu-right{
float:right; width:0px; background-color:black; height:200px;
} .content-box-sidemenu-left{
float:left; width:0px; background-color:black; height:200px;
} .content-box-text{
float:left; width:300px; background-color:grey; height:200px; opacity:1;
} .content-box-hover{
margin:0 auto; padding:10px; opacity:0;
} .content-box-more{
color:#ffffff;
} .mw-headline{
color:#ffffff;
} .editsection{
color:#ffffff;
} </style>