"
Team:UCLondon/Templates/bottom-contentv2
From 2012e.igem.org
(Difference between revisions)
| (58 intermediate revisions not shown) | |||
| Line 22: | Line 22: | ||
border-width: 1px; | border-width: 1px; | ||
padding: 0 10px 10px 10px; | padding: 0 10px 10px 10px; | ||
| + | padding-right:1px; | ||
// height: 60px; | // height: 60px; | ||
| Line 38: | Line 39: | ||
} | } | ||
| - | .middle { float:left; width: | + | .middle { float:left; width:45%; border-left-color: rgb(230, 230, 230); |
border-left-style: solid; | border-left-style: solid; | ||
border-left-width: 1px; | border-left-width: 1px; | ||
| Line 47: | Line 48: | ||
.right { | .right { | ||
float: left; | float: left; | ||
| - | width: | + | width: 30%; |
| - | padding-left: | + | padding-left: 5px; |
border-left-color: rgb(230, 230, 230); | border-left-color: rgb(230, 230, 230); | ||
border-left-style: solid; | border-left-style: solid; | ||
| Line 57: | Line 58: | ||
#sponsor-slides .slides_container { | #sponsor-slides .slides_container { | ||
| - | width: | + | width:100%; |
margin:auto; | margin:auto; | ||
display:none; | display:none; | ||
| + | left:10px; | ||
// overflow: none; | // overflow: none; | ||
} | } | ||
#sponsor-slides .slides_container div { | #sponsor-slides .slides_container div { | ||
| - | width: | + | width:100%; |
| - | height: | + | height:200px; |
display:block; | display:block; | ||
} | } | ||
| - | #sponsor-slides .pagination { margin-top: | + | #sponsor-slides .pagination { margin-top: 1px; width:30px; margin:auto; } |
| Line 77: | Line 79: | ||
#test-slides .slides_container { | #test-slides .slides_container { | ||
| - | width: | + | width:100%; |
| + | height:200px; | ||
margin:auto; | margin:auto; | ||
display:none; | display:none; | ||
| - | + | overflow: auto; | |
} | } | ||
| - | #test-slides .slides_container div.slide { | + | #test-slides .slides_container div, #test-slides .slides_container div.slide { |
| - | width: | + | width:100%; |
| - | height: | + | height:200px; |
display:block; | display:block; | ||
} | } | ||
| - | #test-slides .pagination { margin-top: | + | #test-slides .pagination { margin-top: 1px; } |
/* sponsor grid */ | /* sponsor grid */ | ||
| - | #sponsor-slides { width: 100%; margin: auto; } | + | #sponsor-slides { width: 100%; margin-left: auto; } |
| - | .sponsor-list { padding-left:0; width: | + | .sponsor-list { padding-left:0; width: 85%; } |
.sponsor-list li { | .sponsor-list li { | ||
border: 1px solid silver; | border: 1px solid silver; | ||
| Line 128: | Line 131: | ||
.triangle-isosceles { | .triangle-isosceles { | ||
| - | + | position:relative; | |
| - | padding: | + | padding:1px; |
margin:1em 0 3em; | margin:1em 0 3em; | ||
| - | border: | + | border:2px solid #5a8f00; |
color:#333; | color:#333; | ||
background:#fff; | background:#fff; | ||
| Line 140: | Line 143: | ||
-moz-border-radius:10px; | -moz-border-radius:10px; | ||
border-radius:10px; | border-radius:10px; | ||
| + | |||
| + | |||
} | } | ||
| Line 175: | Line 180: | ||
} | } | ||
| + | .testimonial, #test-slides .slides_container .triangle-isosceles { width:360px !important; height:70px !important; } | ||
| + | .test-author { position:relative; top: -15px; } | ||
| + | |||
| + | |||
| + | |||
| + | |||
| + | #shadow { | ||
| + | |||
| + | background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from( rgba(255, 255, 255, 1) ), to( rgb(249, 249, 249) ) ); | ||
| + | background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 1), rgb(249, 249, 249) ); | ||
| + | background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 1), rgb(249, 249, 249) ); | ||
| + | background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 1), rgb(249, 249, 249) ); | ||
| + | background-image: -o-linear-gradient(top, rgba(255, 255, 255, 1), rgb(249, 249, 249) ); | ||
| + | background-image: linear-gradient(top, rgba(255, 255, 255, 1), rgb(249, 249, 249) ); | ||
| + | |||
| + | |||
| + | box-shadow: 1px 2px 5px 5px #888; | ||
| + | border-radius: 5px; | ||
| + | |||
| + | position:fixed; | ||
| + | height: 400px; | ||
| + | width:50%; | ||
| + | margin:auto; | ||
| + | z-index: 999999999999999999; | ||
| + | } | ||
| - | |||
</style> | </style> | ||
| Line 190: | Line 219: | ||
$('#sponsor-slides').slides({ | $('#sponsor-slides').slides({ | ||
preload: true, | preload: true, | ||
| - | play: | + | play: 15000, |
pause: 2500, | pause: 2500, | ||
hoverPause: true, | hoverPause: true, | ||
| Line 198: | Line 227: | ||
$('#test-slides').slides({ | $('#test-slides').slides({ | ||
preload: true, | preload: true, | ||
| - | play: | + | play: 15000, |
pause: 2500, | pause: 2500, | ||
hoverPause: true, | hoverPause: true, | ||
| Line 256: | Line 285: | ||
<ul class="sponsor-list"> | <ul class="sponsor-list"> | ||
<a href="http://www.clcbio.com" class="sponsor-logo"><li><img src="http://www.clcbio.com/fileadmin/template/main/images/clcbio_logo_no_mirror.png"/></li></a> | <a href="http://www.clcbio.com" class="sponsor-logo"><li><img src="http://www.clcbio.com/fileadmin/template/main/images/clcbio_logo_no_mirror.png"/></li></a> | ||
| - | <a href=" | + | <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a> |
| - | <a href=" | + | <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a> |
| - | <a href=" | + | <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a> |
</ul> | </ul> | ||
</div> | </div> | ||
<div> | <div> | ||
<ul class="sponsor-list"> | <ul class="sponsor-list"> | ||
| - | <a href=" | + | <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a> |
| - | <a href=" | + | <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a> |
| - | <a href=" | + | <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a> |
| - | <a href=" | + | <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a> |
</ul> | </ul> | ||
</div> | </div> | ||
| Line 277: | Line 306: | ||
| + | <div id="shadow" style="display:none;" > | ||
| + | <div id="close-box" style="background:url(http://db.tt/N9CUKlnO) no-repeat 0 0; height:35px; width:35px; cursor:pointer;"></div> | ||
| + | |||
| + | <div id="box-content" style="width:95%; height:95%; margin:auto;"> | ||
| + | <div id="load" style="background:url(http://db.tt/UTRvh0fQ) no-repeat center center; height:100px; width:100px; margin:auto;"></div> | ||
| + | </div> | ||
| + | </div> | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
| + | |||
| + | var loading = ""; | ||
$(document).ready(function() { | $(document).ready(function() { | ||
| Line 286: | Line 324: | ||
console.log('height' + nHeight); | console.log('height' + nHeight); | ||
//$('#footer-boxes').css('height', nHeight); | //$('#footer-boxes').css('height', nHeight); | ||
| - | + | /* $('.footer-box.left').outerHeight(nHeight); | |
$('.footer-box.middle').outerHeight(nHeight); | $('.footer-box.middle').outerHeight(nHeight); | ||
$('.footer-box.right').outerHeight(nHeight); | $('.footer-box.right').outerHeight(nHeight); | ||
*/ | */ | ||
| + | |||
}); | }); | ||
| + | |||
| + | |||
| + | jQuery.fn.center = function () { | ||
| + | var w = $(window); | ||
| + | var b = $('body'); | ||
| + | var mt = w.scrollTop() + (w.height() > b.height()) ? 0: ( -1 *Math.abs( w.outerHeight() - b.outerHeight() )/2 ); | ||
| + | this.css({ | ||
| + | 'position':'fixed', | ||
| + | 'left': '50%', | ||
| + | 'margin-left': 0 - (this.width() / 2), | ||
| + | 'top': '50%', | ||
| + | 'margin-top': (0 - (this.height() / 2)) | ||
| + | }); | ||
| + | return this; | ||
| + | } | ||
| + | |||
| + | |||
| + | var openBox = function () { | ||
| + | $('#shadow').center(); | ||
| + | |||
| + | var input = '<form method="post" id="cntctfrm_contact_form" action="http://codonusageoptimizer.org/contact/" enctype="multipart/form-data"><div style="text-align: left; padding-top: 5px;"><label for="cntctfrm_contact_name">Name:<span class="required"> *</span></label></div><div style="text-align: left;"><input class="text" type="text" size="40" value="" name="cntctfrm_contact_name" id="cntctfrm_contact_name" style="text-align: left; margin: 0;"></div><div style="text-align: left;"><label for="cntctfrm_contact_email">E-Mail Address:<span class="required">*</span></label></div><div style="text-align: left;"><input class="text" type="text" size="40" value="" name="cntctfrm_contact_email" id="cntctfrm_contact_email" style="text-align: left; margin: 0;"></div><div style="text-align: left;"><label for="cntctfrm_contact_subject">Subject:<span class="required"> *</span></label></div><div style="text-align: left;"><input class="text" type="text" size="40" value="" name="cntctfrm_contact_subject" id="cntctfrm_contact_subject" style="text-align: left; margin: 0;"></div><div style="text-align: left;"><label for="cntctfrm_contact_message">Message:<span class="required"> *</span></label></div><div style="text-align: left;"><textarea rows="5" cols="30" name="cntctfrm_contact_message" id="cntctfrm_contact_message"></textarea></div><div style="text-align: left;"><label for="cntctfrm_contact_attachment">Attachment:</label><div style="text-align: left;"><input type="file" name="cntctfrm_contact_attachment" id="cntctfrm_contact_attachment"><label style="font-size:10px;"><br>You can attach files of the following types: html, txt, css, gif, png, jpeg, jpg, tiff, bmp, ai, eps, ps, rtf, pdf, doc, docx, zip, rar, wav, mp3, ppt</label></div></div><div style="text-align: left; padding-top: 8px;"><input type="hidden" value="send" name="cntctfrm_contact_action"><input type="hidden" value="Version: 3.13"><input type="submit" value="Submit" style="cursor: pointer; margin: 0pt; text-align: center;margin-bottom:10px;"> </div></form>'; | ||
| + | |||
| + | |||
| + | $('#shadow').toggle('slow', function() { | ||
| + | $(this).children('#box-content').html(input); | ||
| + | }); | ||
| + | |||
| + | |||
| + | |||
| + | return false; | ||
| + | } | ||
| + | |||
| + | var closeBox = function() { | ||
| + | $('#shadow').toggle('slow', function() { | ||
| + | $(this).children('#box-content').html(loading); | ||
| + | }); | ||
| + | } | ||
| + | |||
| + | |||
| + | |||
| - | + | $(document).ready(function(event) { | |
| + | loading = $('#load').parent().html(); | ||
| + | |||
| + | $('body').off('click', '.nothing', openBox); | ||
| + | $('body').on('click', '.nothing', openBox); | ||
| + | |||
| + | $('body').off('click', '#close-box', closeBox); | ||
| + | $('body').on('click', '#close-box', closeBox); | ||
| + | |||
| + | }); | ||
| + | |||
| + | |||
| + | |||
</script> | </script> | ||
Latest revision as of 17:20, 19 September 2012
Testimonials
I am reaching the end of my PhD on algal molecular biology and have found the CUO extremely useful. To date my use of it has fallen into three categories. My initial use of it was for the assisted design or redesign of several recombinant genes for expression in the Chlamydomonas reinhardtii chloroplast, a task which it has excelled at. Further to this I have used the program extensively for the analysis of previously expressed genes in the C. reinhardtii chloroplast to evaluate trends in expressing and non-expressing sub-sets. The CUO has also proven to be a very powerful tool for the study of the codon and codon pair usage in genes native to the C. reinhardtii chloroplast, a task I would have been unable to complete without this program.
Henry Taunt, PhD Candidate
I have used CUO to optimize several gene and tag sequences for expression in the Chlamydomonas chloroplast. The advantage of this program lies in its integration of codon usage with codon pairing optimization, using data from highly expressed genes. The interface is professional, flexible and easy to navigate and the manual provides clear instructions. Whilst we are still gathering data, early indications are that the program performs very well in redesigning genes for optimal expression.
Dr Rosie Young
