Template:Lyon-INSA/homeCss
From 2012.igem.org
(Difference between revisions)
(480 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
+ | |||
+ | <SCRIPT LANGUAGE="JavaScript"> | ||
+ | // CHARGEMENT DES IMAGES AVANT LE RESTE | ||
+ | i1 = new Image; | ||
+ | i1.src = "https://static.igem.org/mediawiki/2012/0/07/The_lit_B.png"; | ||
+ | i2 = new Image; | ||
+ | i2.src = "https://static.igem.org/mediawiki/2012/0/0f/Menu_T%26T.png"; | ||
+ | |||
+ | i3 = new Image; | ||
+ | i3.src = "https://static.igem.org/mediawiki/2012/3/35/Menu_project.png"; | ||
+ | i4 = new Image; | ||
+ | i4.src = "https://static.igem.org/mediawiki/2012/8/8b/Menu_result.png"; | ||
+ | i5 = new Image; | ||
+ | i5.src = "https://static.igem.org/mediawiki/2012/a/aa/Menu_collabo.png"; | ||
+ | i6 = new Image; | ||
+ | i6.src = "https://static.igem.org/mediawiki/2012/9/9e/Menu_HP.png"; | ||
+ | i7 = new Image; | ||
+ | i7.src = "https://static.igem.org/mediawiki/2012/e/e5/OurtownB.png"; | ||
+ | i8 = new Image; | ||
+ | i8.src = "https://static.igem.org/mediawiki/2012/b/ba/V_and_P_B.png"; | ||
+ | i9 = new Image; | ||
+ | i9.src = "https://static.igem.org/mediawiki/2012/2/2b/Attributions_B.png"; | ||
+ | i10 = new Image; | ||
+ | i10.src = "https://static.igem.org/mediawiki/2012/d/d4/Description_B.png"; | ||
+ | i11 = new Image; | ||
+ | i11.src = "https://static.igem.org/mediawiki/2012/b/b7/Modeling_B.png"; | ||
+ | i12 = new Image; | ||
+ | i12.src = "https://static.igem.org/mediawiki/2012/5/5c/Safety_B.png"; | ||
+ | i13 = new Image; | ||
+ | i13.src = "https://static.igem.org/mediawiki/2012/a/a1/Notebook_B.png"; | ||
+ | i14 = new Image; | ||
+ | i14.src = "https://static.igem.org/mediawiki/2012/f/f9/Protocols_B.png"; | ||
+ | i15 = new Image; | ||
+ | i15.src = "https://static.igem.org/mediawiki/2012/6/61/Results_B.png"; | ||
+ | i16 = new Image; | ||
+ | i16.src = "https://static.igem.org/mediawiki/2012/a/ad/Data_page_B.png"; | ||
+ | i17 = new Image; | ||
+ | i17.src = "https://static.igem.org/mediawiki/2012/a/aa/Achievements_B.png"; | ||
+ | i18 = new Image; | ||
+ | i18.src = "https://static.igem.org/mediawiki/2012/2/22/Menu_LAB.png"; | ||
+ | i19 = new Image; | ||
+ | i19.src = "https://static.igem.org/mediawiki/2012/8/8b/Menu_result.png"; | ||
+ | i20 = new Image; | ||
+ | i20.src = "https://static.igem.org/mediawiki/2012/f/fe/Sponsors_B.png"; | ||
+ | i21 = new Image; | ||
+ | i21.src = "https://static.igem.org/mediawiki/2012/3/3b/Collabo_between_B.png"; | ||
+ | i22 = new Image; | ||
+ | i22.src = "https://static.igem.org/mediawiki/2012/e/e8/Contact_us_B.png"; | ||
+ | i23 = new Image; | ||
+ | i23.src = "https://static.igem.org/mediawiki/2012/7/7f/Context_B.png"; | ||
+ | i24 = new Image; | ||
+ | i24.src = "https://static.igem.org/mediawiki/2012/8/8f/State_of_B.png"; | ||
+ | i25 = new Image; | ||
+ | i25.src = "https://static.igem.org/mediawiki/2012/f/fc/REACH_B.png"; | ||
+ | i26 = new Image; | ||
+ | i26.src = "https://static.igem.org/mediawiki/2012/7/73/Applic_B.png"; | ||
+ | i27 = new Image; | ||
+ | i27.src = "https://static.igem.org/mediawiki/2012/e/e8/Contact_us_B.png"; | ||
+ | i28 = new Image; | ||
+ | i28.src = "https://static.igem.org/mediawiki/2012/1/12/Humanprac_B.png"; | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </SCRIPT> | ||
<style> | <style> | ||
+ | #content a:link {color:#33ccff;} /* unvisited link */ | ||
+ | #content a:visited {color:#66ff99;} /* visited link */ | ||
+ | #content a:hover {color:#9966ff;} /* mouse over link */ | ||
+ | #content a:active {color:#ffffff;} /* selected link */ | ||
- | # | + | #pageContent{ |
+ | margin-top:-220px; | ||
+ | } | ||
+ | |||
+ | ._pt{ | ||
+ | cursor:pointer; | ||
+ | } | ||
+ | |||
+ | #foo:after { | ||
+ | background: -moz-element(#foo); | ||
+ | background: -ms-element(#foo); | ||
+ | background: -o-element(#foo); | ||
+ | background: -webkit-element(#foo); | ||
+ | background: element(#foo); | ||
+ | } | ||
+ | ul | ||
{ | { | ||
- | + | list-style-image:none; | |
+ | list-style-type:circle; | ||
+ | } | ||
+ | |||
+ | .reflect { | ||
+ | position: relative; | ||
} | } | ||
- | h1 | + | .introduction |
+ | { | ||
+ | font-size:16px; | ||
+ | } | ||
+ | |||
+ | .reflect:after { | ||
+ | content:""; | ||
+ | position: absolute; | ||
+ | top:100%; | ||
+ | right:0; | ||
+ | bottom:-100%; | ||
+ | left:0; | ||
+ | z-index: -1; | ||
+ | opacity: .4; | ||
+ | mask: -moz-linear-gradient(90deg, #000, #fff); | ||
+ | -moz-transform:translateY(10px) scaleY(-1); | ||
+ | -ms-transform:translateY(10px) scaleY(-1); | ||
+ | -o-transform:translateY(10px) scaleY(-1); | ||
+ | -webkit-transform:translateY(10px) scaleY(-1); | ||
+ | transform:translateY(10px) scaleY(-1); | ||
+ | } | ||
+ | |||
+ | #top-section { | ||
+ | border:none; | ||
+ | } | ||
+ | #enterWebsite{ | ||
+ | position:absolute; | ||
+ | top:150px; | ||
+ | font-size:30px; | ||
+ | right:100px; | ||
+ | color:#201685; | ||
+ | } | ||
+ | #footer-box { | ||
+ | border:none; | ||
+ | border-top:1px solid #aaa; | ||
+ | background-color:#eff3f6; | ||
+ | |||
+ | } | ||
+ | .wrapper{ | ||
+ | height:0px; | ||
+ | overflow:hidden; | ||
+ | margin:20px; | ||
+ | } | ||
+ | |||
+ | ._ib{ | ||
+ | display:inline-block; | ||
+ | } | ||
+ | h1{ | ||
+ | background:url('http://upload.wikimedia.org/wikipedia/commons/thumb/3/33/Casco_galo.svg/150px-Casco_galo.svg.png') no-repeat; | ||
+ | background-position:-150px -150px; | ||
+ | text-shadow: 0.1em 0.1em 0.05em #333; | ||
+ | } | ||
+ | h2{ | ||
+ | text-shadow: 0.1em 0.1em 0.05em #333; | ||
+ | background:url('https://static.igem.org/mediawiki/2012/6/6d/1345647237_hand-point-270.png') no-repeat; | ||
+ | background-position:20px 13px; | ||
+ | cursor:pointer; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | |||
+ | .firstHeading | ||
+ | { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #catlinks | ||
{ | { | ||
display:none; | display:none; | ||
Line 15: | Line 170: | ||
body | body | ||
{ | { | ||
- | + | background-color:#eff3f6; | |
- | + | ||
- | + | ||
} | } | ||
Line 23: | Line 176: | ||
#content | #content | ||
{ | { | ||
- | background-color: | + | background-color:#262626; |
+ | color:#ccd3db; | ||
border:none; | border:none; | ||
width:1000px; | width:1000px; | ||
- | padding: | + | padding:0px; |
+ | padding-bottom:5px; | ||
+ | margin-top:150px; | ||
+ | border-radius:10px; | ||
+ | -moz-box-shadow: inset 0 0 25px 25px #111111; | ||
+ | -webkit-box-shadow: inset 0 0 25px 25px #111111; | ||
+ | box-shadow: inset 0 0 25px 25px #111111; | ||
} | } | ||
#footer-box { | #footer-box { | ||
width:990px; | width:990px; | ||
+ | margin-bottom:20px; | ||
} | } | ||
Line 38: | Line 199: | ||
h3 | h3 | ||
{ | { | ||
- | font- | + | font-weight:bold; |
color:#cccccc; | color:#cccccc; | ||
- | + | font-size:16px; | |
+ | text-shadow:2px 2px 2px #333333; | ||
} | } | ||
h1 | h1 | ||
{ | { | ||
- | color:# | + | color:#eee; |
+ | margin:20px; | ||
} | } | ||
h2 | h2 | ||
{ | { | ||
- | color:# | + | color:#eee; |
+ | margin:20px; | ||
} | } | ||
Line 59: | Line 223: | ||
#menu | #menu | ||
{ | { | ||
- | + | width:1000px; | |
- | width: | + | |
display:inline-block; | display:inline-block; | ||
- | margin-left: | + | margin-left:40px; |
} | } | ||
.contenuTexte | .contenuTexte | ||
{ | { | ||
- | + | text-align:justify; | |
+ | font-size:15px; | ||
} | } | ||
Line 73: | Line 237: | ||
{ | { | ||
margin:20px; | margin:20px; | ||
- | color:# | + | font-weight:bold; |
- | + | color:#777777; | |
+ | font-size:14px; | ||
+ | text-shadow:2px 2px 2px #333333; | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | + | #p-logo img{ | |
- | { | + | width: 1178px; |
- | + | left: -130px; | |
+ | position: absolute; | ||
} | } | ||
- | + | table | |
- | + | ||
{ | { | ||
- | + | border-collapse: collapse; /* Les bordures du tableau seront collées (plus joli) */ | |
} | } | ||
- | + | td | |
- | + | ||
{ | { | ||
- | + | border: 1px solid black; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | # | + | #menuK{ |
- | { | + | width:150px; |
- | + | margin:20px auto 0 auto; | |
- | + | ||
- | + | ||
} | } | ||
- | + | .menu, .sousmenu{ | |
- | + | text-align:center; | |
- | { | + | |
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | .menu{ | |
- | + | height:18px; | |
- | + | width:180px; | |
- | + | padding:2px 0; | |
- | + | background:#404040; | |
+ | color:#fff; | ||
} | } | ||
- | + | .sousmenu{ | |
- | # | + | height:18px; |
- | { | + | width:180px; |
- | + | padding:1px 0; | |
- | + | background:#808080; | |
+ | color:#fff; | ||
+ | } | ||
+ | .menu a{ | ||
+ | display:block; | ||
+ | width:100%; | ||
+ | height:100%; | ||
+ | color:#fff; | ||
+ | font-family:arial,sans-serif; | ||
+ | font-size:12px; | ||
+ | font-weight:bold; | ||
+ | text-decoration:none; | ||
+ | background:#404040; | ||
+ | } | ||
+ | .sousmenu a{ | ||
+ | display:block; | ||
+ | width:100%; | ||
+ | height:100%; | ||
+ | color:#fff; | ||
+ | font-family:arial,sans-serif; | ||
+ | font-size:12px; | ||
+ | font-weight:bold; | ||
+ | text-decoration:none; | ||
+ | background:#808080; | ||
+ | } | ||
+ | .menu a:hover, .sousmenu a:hover, .menu a:active, .sousmenu a:active, .menu a:focus, .sousmenu a:focus{ | ||
+ | background:#ca0008; | ||
+ | } | ||
+ | #search-controls{ | ||
+ | right:-150px; | ||
+ | } | ||
+ | #tt1:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/0/07/The_lit_B.png'); | ||
+ | } | ||
+ | #tt2:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/e/e5/OurtownB.png'); | ||
+ | } | ||
+ | #tt3:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/b/ba/V_and_P_B.png'); | ||
+ | } | ||
+ | #tt4:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/2/2b/Attributions_B.png'); | ||
+ | } | ||
+ | #pro1:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/d/d4/Description_B.png'); | ||
+ | } | ||
+ | #pro2:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/b/b7/Modeling_B.png'); | ||
+ | } | ||
+ | #pro3:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/5/5c/Safety_B.png'); | ||
+ | } | ||
+ | #lab1:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/a/a1/Notebook_B.png'); | ||
+ | } | ||
+ | #lab2:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/f/f9/Protocols_B.png'); | ||
+ | } | ||
+ | #res1:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/6/61/Results_B.png'); | ||
+ | } | ||
+ | #res2:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/a/ad/Data_page_B.png'); | ||
+ | } | ||
+ | #res3:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/a/aa/Achievements_B.png'); | ||
+ | } | ||
+ | #col1:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/f/fe/Sponsors_B.png'); | ||
+ | } | ||
+ | #col2:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/3/3b/Collabo_between_B.png'); | ||
+ | } | ||
+ | #col3:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/e/e8/Contact_us_B.png'); | ||
+ | } | ||
+ | #hum1:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/7/7f/Context_B.png'); | ||
+ | } | ||
+ | #hum2:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/8/8f/State_of_B.png'); | ||
+ | } | ||
+ | #hum3:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/f/fc/REACH_B.png'); | ||
+ | } | ||
+ | #hum4:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/0/0c/Our_sol_B.png'); | ||
+ | } | ||
+ | #hum5:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/7/73/Applic_B.png'); | ||
+ | } | ||
+ | #hum6:hover{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/1/12/Humanprac_B.png'); | ||
} | } | ||
- | + | </style> | |
- | { | + | <script> |
- | + | $(document).ready(function(){ | |
- | + | ||
- | + | ||
- | + | $("#p-logo").find("img").attr("src","https://static.igem.org/mediawiki/2012/c/c6/Banni%C3%A8re.png"); | |
- | + | }); | |
- | + | </script> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
+ | <body> | ||
- | + | <div id="menuBloc" style="height:80px;background-color:transparent;width:100%;position:relative;top:-80px;left:-28px"> | |
- | + | <div id="teamtown" class="_pt menuprinc" style="background-color:transparent;position:relative;width:190px;height:80px;right:-50px"> | |
- | + | </div> | |
- | + | <div id="project" class="_pt menuprinc" style="background-color:transparent;position:relative;width:130px;height:80px;right:-242px;top:-80px"> | |
- | + | </div> | |
- | + | <div id="lab" class="_pt menuprinc" style="background-color:transparent;position:relative;width:80px;height:80px;right:-374px;top:-160px"> | |
- | + | </div> | |
- | + | <div id="result" class="_pt menuprinc" style="background-color:transparent;position:relative;width:120px;height:80px;right:-456px;top:-240px"> | |
- | + | </div> | |
- | + | <div id="human" class="_pt menuprinc" style="background-color:transparent;position:relative;width:230px;height:80px;right:-578px;top:-320px"> | |
- | + | </div> | |
- | + | <div id="collaboration" class="_pt menuprinc" style="background-color:transparent;position:relative;width:200px;height:80px;right:-810px;top:-400px"> | |
- | + | </div> | |
- | + | </div> | |
- | + | <div id="modifLien" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA';" class="_pt" style="height:170px;background-color:transparent;width:100%;position:relative;top:-320px;left:-0px"> | |
- | + | </div> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | <div id="divtt" class="sousMenu" style="width:1021px;height:101px;position:relative;right:80px;background:url('https://static.igem.org/mediawiki/2012/0/0f/Menu_T%26T.png');top:-220px;display:none;"> | |
- | + | <div id="tt1" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/Team';" style="height:95px;width:302px;position:relative;top:-5px;right:-40px"> | |
- | + | </div> | |
- | + | <div id="tt2" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/town';" style="height:95px;width:193px;position:relative;top:-100px;right:-335px"> | |
- | + | </div> | |
- | + | <div id="tt3" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/videos';" style="height:95px;width:281px;position:relative;top:-195px;right:-520px"> | |
- | + | </div> | |
- | + | <div id="tt4" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/Attributions';" style="height:95px;width:193px;position:relative;top:-290px;right:-810px"> | |
- | + | </div> | |
- | + | </div> | |
- | + | <div id="divproject" class="sousMenu" style="width:639px;height:101px;position:relative;right:80px;background:url('https://static.igem.org/mediawiki/2012/3/35/Menu_project.png');top:-220px;display:none;"> | |
- | height: | + | <div id="pro1" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/project';" style="height:95px;width:193px;position:relative;top:-5px;right:-95px"> |
+ | </div> | ||
+ | <div id="pro2" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/modelling';" style="height:95px;width:193px;position:relative;top:-100px;right:-285px"> | ||
+ | </div> | ||
+ | <div id="pro3" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/safety';" style="height:95px;width:145px;position:relative;top:-195px;right:-465px"> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div id="divlab" class="sousMenu" style="width:537px;height:101px;position:relative;right:80px;background:url('https://static.igem.org/mediawiki/2012/2/22/Menu_LAB.png');top:-220px;display:none;"> | ||
+ | <div id="lab1" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/notebook';" style="height:95px;width:193px;position:relative;top:-5px;right:-95px"> | ||
+ | </div> | ||
+ | <div id="lab2" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/protocol';" style="height:95px;width:193px;position:relative;top:-100px;right:-295px"> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div id="divresult" class="sousMenu" style="width:702px;height:101px;position:relative;right:80px;background:url('https://static.igem.org/mediawiki/2012/8/8b/Menu_result.png');top:-220px;display:none;"> | ||
+ | |||
+ | <div id="res1" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/results';" style="height:95px;width:145px;position:relative;top:-5px;right:-95px"> | ||
+ | </div> | ||
+ | <div id="res2" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/datapage';" style="height:95px;width:193px;position:relative;top:-100px;right:-230px"> | ||
+ | </div> | ||
+ | <div id="res3" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/Achievements';" style="height:95px;width:208px;position:relative;top:-195px;right:-430px"> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | <div id="divcollabo" class="sousMenu" style="width:876px;height:101px;position:relative;right:80px;background:url('https://static.igem.org/mediawiki/2012/a/aa/Menu_collabo.png');top:-220px;display:none;"> | ||
+ | <div id="col1" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/sponsors';" style="height:95px;width:193px;position:relative;top:-5px;right:-55px"> | ||
+ | </div> | ||
+ | <div id="col2" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/collaboration';" style="height:95px;width:405px;position:relative;top:-100px;right:-230px"> | ||
+ | </div> | ||
+ | <div id="col3" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/contact';" style="height:95px;width:193px;position:relative;top:-195px;right:-615px"> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div id="divhuman" class="sousMenu" style="width:1076px;height:101px;position:relative;right:80px;background:url('https://static.igem.org/mediawiki/2012/9/9e/Menu_HP.png');top:-220px;display:none;"> | ||
+ | <div id="hum1" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/Context';" style="height:95px;width:145px;position:relative;top:-5px;right:-45px"> | ||
+ | </div> | ||
+ | <div id="hum2" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/StateArt';" style="height:95px;width:227px;position:relative;top:-100px;right:-170px"> | ||
+ | </div> | ||
+ | <div id="hum3" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/REACH';" style="height:95px;width:145px;position:relative;top:-195px;right:-375px"> | ||
+ | </div> | ||
+ | <div id="hum4" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/BiofilmK';" style="height:95px;width:193px;position:relative;top:-290px;right:-500px"> | ||
+ | </div> | ||
+ | <div id="hum5" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/microbialControl';" style="height:95px;width:193px;position:relative;top:-385px;right:-670px"> | ||
+ | </div> | ||
+ | <div id="hum6" class="_pt" onclick="window.location='https://2012.igem.org/Team:Lyon-INSA/HP';" style="height:95px;width:242px;position:relative;top:-480px;right:-840px"> | ||
+ | </div> | ||
+ | </div> | ||
+ | </body> | ||
+ | |||
+ | <style> | ||
+ | |||
+ | .menuprinc{ | ||
+ | background:url('https://static.igem.org/mediawiki/2012/9/98/Fleche2.png') no-repeat; | ||
+ | background-position:-50px -50px; | ||
} | } | ||
</style> | </style> | ||
+ | |||
+ | <script> | ||
+ | var btnClicked; | ||
+ | |||
+ | $(".menuprinc").mouseout(function(){ | ||
+ | |||
+ | $(".menuprinc").each(function(){ | ||
+ | var btn = $(this).attr('id'); | ||
+ | if (btn!=btnClicked) | ||
+ | { | ||
+ | $(this).css("background-position","-50px -50px"); | ||
+ | } | ||
+ | }); | ||
+ | }); | ||
+ | |||
+ | $("#human").mouseover(function(){ | ||
+ | $("#human").css("background-position","99px 63px"); | ||
+ | }); | ||
+ | $("#lab").mouseover(function(){ | ||
+ | $("#lab").css("background-position","24px 63px"); | ||
+ | }); | ||
+ | $("#project").mouseover(function(){ | ||
+ | $("#project").css("background-position","49px 63px"); | ||
+ | }); | ||
+ | $("#collaboration").mouseover(function(){ | ||
+ | $("#collaboration").css("background-position","84px 63px"); | ||
+ | }); | ||
+ | $("#result").mouseover(function(){ | ||
+ | $("#result").css("background-position","44px 63px"); | ||
+ | }); | ||
+ | $("#teamtown").mouseover(function(){ | ||
+ | $("#teamtown").css("background-position","79px 63px"); | ||
+ | }); | ||
+ | |||
+ | $("#teamtown").click( | ||
+ | function(){ | ||
+ | btnClicked = $(this).attr('id'); | ||
+ | $(".menuprinc").css("background-position","-50px -50px"); | ||
+ | $(".sousMenu").hide(); | ||
+ | $("#divtt").fadeIn(); | ||
+ | $("#teamtown").css("background-position","79px 63px"); | ||
+ | }); | ||
+ | $("#project").click( | ||
+ | function(){ | ||
+ | btnClicked = $(this).attr('id'); | ||
+ | $(".menuprinc").css("background-position","-50px -50px"); | ||
+ | $(".sousMenu").hide(); | ||
+ | $("#divproject").fadeIn(); | ||
+ | $("#project").css("background-position","49px 63px"); | ||
+ | }); | ||
+ | $("#collaboration").click( | ||
+ | function(){ | ||
+ | btnClicked = $(this).attr('id'); | ||
+ | $(".menuprinc").css("background-position","-50px -50px"); | ||
+ | $(".sousMenu").hide(); | ||
+ | $("#divcollabo").fadeIn(); | ||
+ | |||
+ | $("#collaboration").css("background-position","84px 63px"); | ||
+ | }); | ||
+ | $("#lab").click( | ||
+ | function(){ | ||
+ | btnClicked = $(this).attr('id'); | ||
+ | $(".menuprinc").css("background-position","-50px -50px"); | ||
+ | $(".sousMenu").hide(); | ||
+ | $("#divlab").fadeIn(); | ||
+ | |||
+ | $("#lab").css("background-position","24px 63px"); | ||
+ | }); | ||
+ | $("#human").click( | ||
+ | function(){ | ||
+ | btnClicked = $(this).attr('id'); | ||
+ | $(".menuprinc").css("background-position","-50px -50px"); | ||
+ | $(".sousMenu").hide(); | ||
+ | $("#divhuman").fadeIn(); | ||
+ | |||
+ | $("#human").css("background-position","99px 63px"); | ||
+ | }); | ||
+ | $("#result").click( | ||
+ | function(){ | ||
+ | btnClicked = $(this).attr('id'); | ||
+ | $(".menuprinc").css("background-position","-50px -50px"); | ||
+ | $(".sousMenu").hide(); | ||
+ | $("#divresult").fadeIn(); | ||
+ | |||
+ | $("#result").css("background-position","44px 63px"); | ||
+ | }); | ||
+ | |||
+ | </script> | ||
+ | |||
+ | </html> |
Latest revision as of 15:03, 26 October 2012