Template:CSS/UT-Tokyo
From 2014.igem.org
(Difference between revisions)
Pineappler (Talk | contribs) |
Pineappler (Talk | contribs) |
||
(30 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
<head> | <head> | ||
+ | <script type="text/javascript"> | ||
+ | function changeIcon(URL) { | ||
+ | var target = document.getElementsByTagName("link"); | ||
+ | var i = 0; | ||
+ | for(i = 0;i<target.length;i++){ | ||
+ | if(target[i].rel == "shortcut icon"){ | ||
+ | target[i].parentNode.removeChild(target[i]); | ||
+ | break; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | var link = document.createElement("link"); | ||
+ | link.type = "image/x-icon"; | ||
+ | link.rel = "shortcut icon"; | ||
+ | link.href = URL; | ||
+ | |||
+ | document.getElementsByTagName("head")[0].appendChild(link); | ||
+ | } | ||
+ | |||
+ | changeIcon("https://static.igem.org/mediawiki/2014/a/a9/Icon_32.gif"); | ||
+ | |||
+ | </script> | ||
+ | |||
<style type="text/css"> | <style type="text/css"> | ||
Line 309: | Line 332: | ||
top:350px; | top:350px; | ||
right:50%; | right:50%; | ||
- | + | margin-right:100px; | |
+ | z-index:200; | ||
+ | border-radius:30px; | ||
} | } | ||
#right-img{ | #right-img{ | ||
Line 316: | Line 341: | ||
top:350px; | top:350px; | ||
left:50%; | left:50%; | ||
- | + | margin-left:100px; | |
+ | z-index:200; | ||
+ | border-radius:30px; | ||
} | } | ||
#left-bottom{ | #left-bottom{ | ||
Line 341: | Line 368: | ||
} | } | ||
.content-box{ | .content-box{ | ||
- | width: | + | width:1000px; |
background-color:#FFF; | background-color:#FFF; | ||
margin-left:auto; | margin-left:auto; | ||
Line 349: | Line 376: | ||
border-radius:10px; | border-radius:10px; | ||
margin-bottom:30px; | margin-bottom:30px; | ||
+ | min-height:150px; | ||
} | } | ||
.content-box h2, p{ | .content-box h2, p{ | ||
color:#000; | color:#000; | ||
margin-left:30px; | margin-left:30px; | ||
- | width: | + | width:950px; |
} | } | ||
.content-box h2{ | .content-box h2{ | ||
Line 365: | Line 393: | ||
img.circle{ | img.circle{ | ||
visibility:hidden; | visibility:hidden; | ||
- | width: | + | width:150px; |
position:absolute; | position:absolute; | ||
} | } | ||
Line 373: | Line 401: | ||
} | } | ||
.content-box #box-right{ | .content-box #box-right{ | ||
- | width: | + | width:400px; |
- | float: | + | float:left; |
} | } | ||
#box-right h2, #box-left h2{ | #box-right h2, #box-left h2{ | ||
+ | width:300px; | ||
+ | } | ||
+ | img.sns{ | ||
width:150px; | width:150px; | ||
+ | padding-left:2px; | ||
+ | padding-bottom:10px; | ||
+ | } | ||
+ | img{ | ||
+ | border:0; | ||
} | } | ||
- | |||
</style> | </style> | ||
<script type = "text/javascript" language = "Javascript"> | <script type = "text/javascript" language = "Javascript"> | ||
function randomEcoli(){ | function randomEcoli(){ | ||
- | var | + | document.title = "TOP | UT-Tokyo 2014"; |
- | var str = "circle0" + | + | var rand1 = Math.floor(Math.random()*9)+1; |
+ | var str = "circle0" + rand1; | ||
document.getElementById(str).style.visibility = "visible"; | document.getElementById(str).style.visibility = "visible"; | ||
document.getElementById(str).style.top = "280px"; | document.getElementById(str).style.top = "280px"; | ||
document.getElementById(str).style.right = "50%"; | document.getElementById(str).style.right = "50%"; | ||
document.getElementById(str).style.paddingRight = "380px"; | document.getElementById(str).style.paddingRight = "380px"; | ||
- | var | + | var rand2 = Math.floor(Math.random()*9)+1; |
- | var str = "circle0" + | + | var str = "circle0" + rand2; |
document.getElementById(str).style.visibility = "visible"; | document.getElementById(str).style.visibility = "visible"; | ||
document.getElementById(str).style.top = "580px"; | document.getElementById(str).style.top = "580px"; | ||
Line 396: | Line 432: | ||
document.getElementById(str).style.paddingRight = "100px"; | document.getElementById(str).style.paddingRight = "100px"; | ||
document.getElementById(str).style.zIndex = "100"; | document.getElementById(str).style.zIndex = "100"; | ||
- | var | + | var rand3 = Math.floor(Math.random()*9)+1; |
- | var str = "circle0" + | + | var str = "circle0" + rand3; |
document.getElementById(str).style.visibility = "visible"; | document.getElementById(str).style.visibility = "visible"; | ||
- | document.getElementById(str).style.top = " | + | document.getElementById(str).style.top = "300px"; |
+ | document.getElementById(str).style.right = ""; | ||
+ | document.getElementById(str).style.paddingRight = ""; | ||
document.getElementById(str).style.left = "50%"; | document.getElementById(str).style.left = "50%"; | ||
- | document.getElementById(str).style. | + | document.getElementById(str).style.marginLeft = "-30px"; |
- | var | + | var rand4 = Math.floor(Math.random()*9)+1; |
- | var str = "circle0" + | + | var str = "circle0" + rand4; |
document.getElementById(str).style.visibility = "visible"; | document.getElementById(str).style.visibility = "visible"; | ||
document.getElementById(str).style.top = "270px"; | document.getElementById(str).style.top = "270px"; | ||
+ | document.getElementById(str).style.right = ""; | ||
+ | document.getElementById(str).style.paddingRight = ""; | ||
+ | document.getElementById(str).style.marginLeft = ""; | ||
document.getElementById(str).style.left = "50%"; | document.getElementById(str).style.left = "50%"; | ||
document.getElementById(str).style.paddingLeft = "400px"; | document.getElementById(str).style.paddingLeft = "400px"; | ||
- | var | + | var rand5 = Math.floor(Math.random()*9)+1; |
- | var str = "circle0" + | + | var str = "circle0" + rand5; |
document.getElementById(str).style.visibility = "visible"; | document.getElementById(str).style.visibility = "visible"; | ||
document.getElementById(str).style.top = "50px"; | document.getElementById(str).style.top = "50px"; | ||
+ | document.getElementById(str).style.right = ""; | ||
+ | document.getElementById(str).style.paddingRight = ""; | ||
+ | document.getElementById(str).style.marginLeft = ""; | ||
+ | document.getElementById(str).style.paddingLeft = ""; | ||
document.getElementById(str).style.left = "50%"; | document.getElementById(str).style.left = "50%"; | ||
document.getElementById(str).style.paddingLeft = "350px"; | document.getElementById(str).style.paddingLeft = "350px"; | ||
+ | var rand6 = Math.floor(Math.random()*9)+1; | ||
+ | var str = "circle0" + rand6; | ||
+ | document.getElementById(str).style.visibility = "visible"; | ||
+ | document.getElementById(str).style.top = "440px"; | ||
+ | document.getElementById(str).style.right = ""; | ||
+ | document.getElementById(str).style.paddingRight = ""; | ||
+ | document.getElementById(str).style.marginLeft = ""; | ||
+ | document.getElementById(str).style.paddingLeft = ""; | ||
+ | document.getElementById(str).style.left = "50%"; | ||
+ | document.getElementById(str).style.marginLeft = "-120px"; | ||
+ | var rand7 = Math.floor(Math.random()*9)+1; | ||
+ | var str = "circle0" + rand7; | ||
+ | document.getElementById(str).style.visibility = "visible"; | ||
+ | document.getElementById(str).style.top = "540px"; | ||
+ | document.getElementById(str).style.left = ""; | ||
+ | document.getElementById(str).style.paddingRight = ""; | ||
+ | document.getElementById(str).style.marginLeft = ""; | ||
+ | document.getElementById(str).style.paddingLeft = ""; | ||
+ | document.getElementById(str).style.right = "50%"; | ||
+ | document.getElementById(str).style.paddingRight = "370px"; | ||
+ | document.getElementById(str).style.zIndex = "100"; | ||
} | } | ||
</script> | </script> |
Latest revision as of 03:27, 18 October 2014