Template:Sifuentes04
From 2014.igem.org
(Difference between revisions)
(174 intermediate revisions not shown) | |||
Line 21: | Line 21: | ||
width: 100%; | width: 100%; | ||
height: 100%; | height: 100%; | ||
- | background-color: # | + | background-color: #58585b; |
} | } | ||
Line 29: | Line 29: | ||
height: 100%; | height: 100%; | ||
border: 0px; | border: 0px; | ||
- | background-color: | + | background-color: #fff; |
margin: 0px; | margin: 0px; | ||
padding: 0px; | padding: 0px; | ||
Line 82: | Line 82: | ||
#featureBoxLeft { | #featureBoxLeft { | ||
background-color: #ffffff; | background-color: #ffffff; | ||
- | padding: 5px 10px | + | padding: 5px 10px 5px 10px; |
border: 1px solid #cccccc; | border: 1px solid #cccccc; | ||
border-radius: 5px; | border-radius: 5px; | ||
+ | margin:auto; | ||
+ | text-align: center; | ||
} | } | ||
Line 136: | Line 138: | ||
background-color: #c1dfa6; | background-color: #c1dfa6; | ||
} | } | ||
+ | |||
/* general styling */ | /* general styling */ | ||
Line 179: | Line 182: | ||
} | } | ||
+ | |||
+ | .featureBoxButtons { | ||
+ | display: inline-block; | ||
+ | } | ||
+ | |||
+ | #featureBoxImage{ | ||
+ | display: inline-block; | ||
+ | margin:auto; | ||
+ | |||
+ | |||
+ | } | ||
.smallBlockRight img { | .smallBlockRight img { | ||
Line 205: | Line 219: | ||
/*collapse and expand */ | /*collapse and expand */ | ||
.collapseMenu { | .collapseMenu { | ||
- | background: | + | background: transparent; |
margin: 5px 0 0 0; | margin: 5px 0 0 0; | ||
padding: 5px 20px; | padding: 5px 20px; | ||
Line 282: | Line 296: | ||
</style> | </style> | ||
- | + | <!-- end of css --> | |
+ | <!-- javascript for the featurebox --> | ||
+ | <!-- image size should be 145 x 145 px --> | ||
+ | <script type="text/javascript"> | ||
- | <!-- jquery --> | + | var arrayPosition = 0; |
+ | |||
+ | |||
+ | var imgFeatureBox= new Array(); | ||
+ | imgFeatureBox[0] = "https://static.igem.org/mediawiki/2014/0/03/Featurebox_startateam.jpg"; | ||
+ | imgFeatureBox[1] = "https://static.igem.org/mediawiki/2014/4/4c/Featureboxdemo.jpg"; | ||
+ | |||
+ | var titleFeatureBox = new Array(); | ||
+ | titleFeatureBox[0] = "Starting a Team"; | ||
+ | titleFeatureBox[1] = "Registration"; | ||
+ | |||
+ | var textFeatureBox = new Array(); | ||
+ | textFeatureBox[0] = "All you need to know before starting your iGEM team"; | ||
+ | textFeatureBox[1] = "Registration for iGEM 2015 will open soon "; | ||
+ | |||
+ | |||
+ | |||
+ | function changeTitle(n) { | ||
+ | document.getElementById("featureBoxTitle").innerHTML = titleFeatureBox[n]; | ||
+ | } | ||
+ | |||
+ | function changeText(n) { | ||
+ | document.getElementById("featureText").innerHTML = textFeatureBox[n]; | ||
+ | } | ||
+ | |||
+ | |||
+ | function changeImg(n) { | ||
+ | var imgobj = document.getElementById('imageNumber'); | ||
+ | imgobj.src =imgFeatureBox[n]; | ||
+ | } | ||
+ | |||
+ | function moveLeft() { | ||
+ | arrayPosition -= 1; | ||
+ | if (arrayPosition < 0) | ||
+ | arrayPosition = imgFeatureBox.length - 1; | ||
+ | |||
+ | changeImg(arrayPosition); | ||
+ | changeText(arrayPosition); | ||
+ | changeTitle(arrayPosition); | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | function moveRight() { | ||
+ | arrayPosition += 1; | ||
+ | if (arrayPosition >= imgFeatureBox.length) | ||
+ | arrayPosition = 0; | ||
+ | |||
+ | changeImg(arrayPosition); | ||
+ | changeText(arrayPosition); | ||
+ | changeTitle(arrayPosition); | ||
+ | |||
+ | } | ||
+ | |||
+ | </script> | ||
+ | |||
+ | <!-- end of javascript--> | ||
+ | |||
+ | <!-- jquery --> | ||
<script ="text/javascript"> | <script ="text/javascript"> | ||
+ | |||
$(document).ready(function() { | $(document).ready(function() { | ||
//Add Inactive Class To All Accordion Headers | //Add Inactive Class To All Accordion Headers | ||
- | $('.accordion- | + | $('.accordion-header').toggleClass('inactive-header'); |
- | + | ||
- | + | ||
//Set The Accordion Content Width | //Set The Accordion Content Width | ||
var contentwidth = $('.accordion-header').width(); | var contentwidth = $('.accordion-header').width(); | ||
$('.accordion-content').css({'width' : contentwidth }); | $('.accordion-content').css({'width' : contentwidth }); | ||
+ | |||
+ | var checkIfActive = 0; | ||
+ | |||
+ | $('.collapseMenu').click(function () { | ||
+ | if (checkIfActive == 0) { | ||
+ | $('.collapseMenu').html("Collapse All"); | ||
+ | checkIfActive = 1; | ||
+ | $('.accordion-header').next().slideToggle().toggleClass('open-content'); | ||
+ | } | ||
+ | else { | ||
+ | checkIfActive = 0; | ||
+ | $('.accordion-header').next().slideToggle().toggleClass('open-content'); | ||
+ | $('.collapseMenu').html("Expand All"); | ||
+ | |||
+ | |||
+ | } | ||
+ | |||
+ | }); | ||
+ | |||
+ | |||
+ | |||
// The Accordion Effect | // The Accordion Effect | ||
$('.accordion-header').click(function () { | $('.accordion-header').click(function () { | ||
Line 318: | Line 414: | ||
}); | }); | ||
+ | </script> | ||
+ | <!-- end of jquery--> | ||
+ | <!-- template content --> | ||
+ | <div id ="contentWrap"> | ||
+ | |||
+ | |||
+ | <div id="leftColumn"> | ||
+ | <!-- this is where the menu and feature box go --> | ||
+ | |||
+ | <div id="featureBoxLeft"> | ||
+ | <h3 id="featureBoxTitle">Starting a Team</h3> | ||
+ | |||
+ | <div class="featureBoxButtons"> | ||
+ | <a href="#" onClick="moveLeft()"><img src="https://static.igem.org/mediawiki/2014/c/ce/Featurebox_leftbutton.jpg" width="20" height="20"></a> | ||
+ | </div> | ||
- | + | <div id="featureBoxImage"> | |
- | + | ||
- | + | <img src="https://static.igem.org/mediawiki/2014/0/03/Featurebox_startateam.jpg" width="145" height="145" id="imageNumber"> | |
- | + | ||
- | + | ||
- | / | + | </div> |
- | + | <div class="featureBoxButtons"> | |
- | < | + | <a href="#" onClick="moveRight()"><img src="https://static.igem.org/mediawiki/2014/f/fa/Featurebox_rightbutton.jpg" width="20" height="20"> </a> |
+ | </div> | ||
+ | <p id="featureText">All you need to know before starting your iGEM team</p> | ||
+ | </div> | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
<div class="clear"></div> | <div class="clear"></div> | ||
Line 360: | Line 453: | ||
<div id="menuWrap"> | <div id="menuWrap"> | ||
- | < | + | <h4 class="collapseMenu">Expand All</h4> |
<h3 class="accordion-header">About iGEM</h3> | <h3 class="accordion-header">About iGEM</h3> | ||
<div class="accordion-content"> | <div class="accordion-content"> | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
- | <li><a href="https://2014.igem.org/ | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">What is iGEM?</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Previous Competitions</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">iGEM Headquarters</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Press Kit</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Join our Newsletter</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Sponsor iGEM</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
Line 377: | Line 470: | ||
<div class="accordion-content"> | <div class="accordion-content"> | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage2">Starting a Team</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">General Requirements</a></li> |
+ | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Funding</a></li> | ||
<li><a href="https://2014.igem.org/Sifuentes_contentpage1">General iGEM Guide</a></li> | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">General iGEM Guide</a></li> | ||
</ul> | </ul> | ||
Line 386: | Line 480: | ||
<div class="accordion-content"> | <div class="accordion-content"> | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Calendar of Events</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Key Deadlines</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
Line 395: | Line 489: | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
<li><a href="">General Requirements</a></li> | <li><a href="">General Requirements</a></li> | ||
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Wiki how-to</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Poster Guidelines</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Presentation Guidelines</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Two Page Summary</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Safety Requirements</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
Line 406: | Line 500: | ||
<div class="accordion-content"> | <div class="accordion-content"> | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">New Tracks</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">High School</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Complete List</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
Line 415: | Line 509: | ||
<div class="accordion-content"> | <div class="accordion-content"> | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage3">How to register</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Fees</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
Line 423: | Line 517: | ||
<div class="accordion-content"> | <div class="accordion-content"> | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Registry at a glance</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">2015 DNA distribution</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
Line 430: | Line 524: | ||
<div class="accordion-content"> | <div class="accordion-content"> | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage4">General Information</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Event Website</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
Line 439: | Line 533: | ||
<div class="accordion-content"> | <div class="accordion-content"> | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Introduction</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Risk Groups</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Biosafety Levels</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Safety Committee</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Deadlines</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Help</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
Line 452: | Line 546: | ||
<div class="accordion-content"> | <div class="accordion-content"> | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Introduction</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Medals and Awards</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Deadlines</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Judging Handbook</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
Line 462: | Line 556: | ||
<div class="accordion-content"> | <div class="accordion-content"> | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Meetups</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Community page</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
Line 470: | Line 564: | ||
<div class="accordion-content"> | <div class="accordion-content"> | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Judging Form</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Safety Form</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">About our Lab</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
Line 480: | Line 574: | ||
<div class="accordion-content"> | <div class="accordion-content"> | ||
<ul class="submenuoptions"> | <ul class="submenuoptions"> | ||
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Wikis</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">List</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Parts</a></li> |
- | <li><a href=" | + | <li><a href="https://2014.igem.org/Sifuentes_contentpage1">Tracks</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
+ | |||
+ | |||
</div> <!-- this closes the menu div --> | </div> <!-- this closes the menu div --> | ||
+ | </div> | ||
+ | <div id="clear"></div> | ||
+ | |||
+ | |||
</div> <!-- this closes the content wrap div --> | </div> <!-- this closes the content wrap div --> | ||
Latest revision as of 15:02, 22 January 2015