Team:MIT/styles

From 2011.igem.org

(Difference between revisions)
Line 4: Line 4:
.bio img {max-width:300px; float:left; margin-right:10px;}
.bio img {max-width:300px; float:left; margin-right:10px;}
.bio {clear:both;}
.bio {clear:both;}
 +
 +
<script type="text/javascript">
 +
$('#rightMenu a')
 +
.css( {backgroundPosition: "0 0"} )
 +
.mouseover(function(){
 +
$(this).stop().animate(
 +
{backgroundPosition:"(0 -250px)"},
 +
{duration:500})
 +
})
 +
.mouseout(function(){
 +
$(this).stop().animate(
 +
{backgroundPosition:"(0 0)"},
 +
{duration:500})
 +
})
 +
</script>
 +
<script type="text/javascript">
 +
$(function() {
 +
$("#button").toggle(
 +
function() {
 +
$("#effect").animate({backgroundColor: '#aa0000', color: '#fff', width: 500}, 1000);
 +
},
 +
function() {
 +
$("#effect").animate({backgroundColor: '#fff', color: '#000', width: 240}, 1000);
 +
}
 +
);
 +
});
 +
$(document).ready(function(){
 +
if($("#nav")) {
 +
$("#nav dd").hide();
 +
$("#nav dt b").click(function() {
 +
if(this.className.indexOf("clicked") != -1) {
 +
$(this).parent().next().slideUp(200);
 +
$(this).removeClass("clicked");
 +
}
 +
else {
 +
$("#nav dt b").removeClass();
 +
$(this).addClass("clicked");
 +
$("#nav dd:visible").slideUp(200);
 +
$(this).parent().next().slideDown(500);
 +
}
 +
return false;
 +
});
 +
}
 +
});
 +
 +
</script>
 +
<!--[if IE]>
 +
<style>
 +
#header {
 +
width: 900px;
 +
}
 +
</style>
 +
<![endif]-->
 +
<style type="text/css">
 +
.toggler { width: 500px; height: 200px; position: relative;}
 +
#button { padding: .5em 1em; text-decoration: none; }
 +
#effect { width: 240px; height: 135px; padding: 0.4em; position: relative; background: #fff; }
 +
#effect h3 { margin: 0; padding: 0.4em; text-align: center; }
 +
 +
 +
#header {
 +
position: relative;
 +
left: 2px;
 +
text-align: left;
 +
margin: 0px;
 +
width: 955px;
 +
}
 +
 +
#header a {
 +
color: white;
 +
}
 +
 +
#content {
 +
background-color: transparent;
 +
border: none;
 +
}

Revision as of 01:11, 18 June 2011

ul {list-style: none}


.bio img {max-width:300px; float:left; margin-right:10px;} .bio {clear:both;}

<script type="text/javascript"> $('#rightMenu a') .css( {backgroundPosition: "0 0"} ) .mouseover(function(){ $(this).stop().animate( {backgroundPosition:"(0 -250px)"}, {duration:500}) }) .mouseout(function(){ $(this).stop().animate( {backgroundPosition:"(0 0)"}, {duration:500}) }) </script> <script type="text/javascript"> $(function() { $("#button").toggle( function() { $("#effect").animate({backgroundColor: '#aa0000', color: '#fff', width: 500}, 1000); }, function() { $("#effect").animate({backgroundColor: '#fff', color: '#000', width: 240}, 1000); } ); }); $(document).ready(function(){ if($("#nav")) { $("#nav dd").hide(); $("#nav dt b").click(function() { if(this.className.indexOf("clicked") != -1) { $(this).parent().next().slideUp(200); $(this).removeClass("clicked"); } else { $("#nav dt b").removeClass(); $(this).addClass("clicked"); $("#nav dd:visible").slideUp(200); $(this).parent().next().slideDown(500); } return false; }); } });

</script> <style type="text/css"> .toggler { width: 500px; height: 200px; position: relative;} #button { padding: .5em 1em; text-decoration: none; } #effect { width: 240px; height: 135px; padding: 0.4em; position: relative; background: #fff; } #effect h3 { margin: 0; padding: 0.4em; text-align: center; }


  1. header { 
position: relative;
left: 2px;
text-align: left;
margin: 0px;
width: 955px;

}

  1. header a { 
color: white;
}
  1. content { 
background-color: transparent;
border: none;
}
Retrieved from "http://2011.igem.org/Team:MIT/styles"