Template:Team:HokkaidoU Japan/HumanPractice/script
From 2011.igem.org
(Difference between revisions)
Line 3: | Line 3: | ||
</script> | </script> | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
- | $(function(){ | + | $(function(){ |
- | $ | + | var $toc = $('#toc'); |
- | + | var $tab = $('<div>').addClass('toc-tab'); | |
- | + | var $close = $('<div>').addClass('close'); | |
- | + | var $wrapper = $('<div>').addClass('toc-wrapper'); | |
- | + | $toc.before($tab); | |
- | + | $toc.wrap($wrapper); | |
- | + | $toc.before($close) | |
- | + | $wrapper = $('.toc-wrapper'); | |
- | + | $wrapper.hide(); | |
- | + | $tab.bind('click', function(){ | |
- | + | $tab.hide(); | |
+ | $wrapper.fadeIn('normal'); | ||
+ | $close.bind('click', function(){ | ||
+ | $wrapper.fadeOut('normal'); | ||
+ | $tab.show(); | ||
}); | }); | ||
- | |||
}); | }); | ||
}); | }); | ||
</script> | </script> | ||
<style> | <style> | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
.close-btn-32 { | .close-btn-32 { | ||
display: block; | display: block; | ||
Line 77: | Line 60: | ||
line-height: 32px; | line-height: 32px; | ||
font-family: "Helvetica Neue", Consolas, Verdana, Tahoma, Calibri, Helvetica, Menlo, "Droid Sans", sans-serif; | font-family: "Helvetica Neue", Consolas, Verdana, Tahoma, Calibri, Helvetica, Menlo, "Droid Sans", sans-serif; | ||
+ | } | ||
+ | div.footnote-box { | ||
+ | background: rgb(125,126,125); | ||
+ | background: -moz-linear-gradient(top, rgba(125,126,125,0.85) 0%, rgba(14,14,14,0.85) 100%); | ||
+ | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,0.85)), color-stop(100%,rgba(14,14,14,0.85))); | ||
+ | background: -webkit-linear-gradient(top, rgba(125,126,125,0.85) 0%,rgba(14,14,14,0.85) 100%); | ||
+ | background: -o-linear-gradient(top, rgba(125,126,125,0.85) 0%,rgba(14,14,14,0.85) 100%); | ||
+ | background: -ms-linear-gradient(top, rgba(125,126,125,0.85) 0%,rgba(14,14,14,0.85) 100%); | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); | ||
+ | background: linear-gradient(top, rgba(125,126,125,0.85) 0%,rgba(14,14,14,0.85) 100%); | ||
+ | margin 0 auto; | ||
+ | border: 3px solid #dfdfdf; | ||
+ | border-radius: 10px; | ||
+ | -moz-border-radius: 10px; | ||
+ | -webkit-border-radius: 10px; | ||
+ | display: block; | ||
+ | padding: 20px 20px; | ||
+ | width: 40%; | ||
+ | height: auto; | ||
+ | max-height: 60%; | ||
+ | overflow: auto; | ||
+ | box-shadow: 3px 3px 5px #333; | ||
+ | -moz-box-shadow: 3px 3px 5px #333; | ||
+ | -webkit-box-shadow: 3px 3px 5px #333; | ||
} | } | ||
.footnote-box div.footnote-content { | .footnote-box div.footnote-content { | ||
color: #fefefe; | color: #fefefe; | ||
font-size: large !important; | font-size: large !important; | ||
- | margin: auto | + | margin: 0px auto 10px; |
width: 80%; | width: 80%; | ||
- | height: 80%; | + | height: 100%; |
+ | } | ||
+ | .footnote-box h2 { | ||
+ | color: #fefefe; | ||
+ | height : 80%; | ||
+ | margin-bottom: 10px; | ||
+ | border-bottom-width: 5px; | ||
+ | padding-left: 8px; | ||
+ | padding-bottom: 3px; | ||
+ | font-size: 250%; | ||
+ | text-align: center; | ||
} | } | ||
</style> | </style> | ||
</html> | </html> |
Revision as of 16:55, 5 October 2011