Team:UCLondon/Templates/bottom-contentv2
From 2012e.igem.org
(Difference between revisions)
Line 177: | Line 177: | ||
#test-slides .slides_container .triangle-isosceles { height:500px;} | #test-slides .slides_container .triangle-isosceles { height:500px;} | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | #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: 2; | ||
+ | } | ||
+ | |||
</style> | </style> | ||
Line 277: | Line 301: | ||
+ | <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 319: | ||
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); | ||
*/ | */ | ||
+ | |||
+ | loading = $('#load').parent().html(); | ||
}); | }); | ||
+ | |||
+ | |||
+ | 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(); | ||
+ | |||
+ | |||
+ | $('#shadow').toggle('slow', function() { | ||
+ | $(this).children('#box-content').html('<p>Hello World</p>"); | ||
+ | }); | ||
+ | |||
+ | |||
+ | |||
+ | return false; | ||
+ | } | ||
+ | |||
- | function sponsoring(){ } | + | function sponsoring(){ openBox(); } |
+ | |||
+ | |||
+ | $(document).ready(function(event) { | ||
+ | loading = $('#load').parent().html(); | ||
+ | |||
+ | $('body').off('click', '#close-box', closeBox); | ||
+ | $('body').on('click', '#close-box', closeBox); | ||
+ | |||
+ | }); | ||
</script> | </script> |
Revision as of 03:47, 19 September 2012