| Line 1: | Line 1: | ||
<html lang="en"> | <html lang="en"> | ||
| + | <style> | ||
| + | /* Paste this css to your style sheet file or under head tag */ | ||
| + | /* This only works with JavaScript, | ||
| + | if it's not present, don't show loader */ | ||
| + | .js #loader { | ||
| + | display: block; | ||
| + | position: absolute; | ||
| + | left: 100px; | ||
| + | top: 0; | ||
| + | } | ||
| + | |||
| + | .se-pre-con { | ||
| + | position: fixed; | ||
| + | left: 0px; | ||
| + | top: 0px; | ||
| + | width: 100%; | ||
| + | height: 100%; | ||
| + | z-index: 9999; | ||
| + | background: #292935; | ||
| + | } | ||
| + | |||
| + | .se-pre-con img { | ||
| + | width: 40%; | ||
| + | height: 40%; | ||
| + | margin-left: 30%; | ||
| + | margin-top: 15%; | ||
| + | } | ||
| + | |||
| + | @media screen and (min-width: 1500px ) { | ||
| + | .se-pre-con img { | ||
| + | margin-top: 20%; | ||
| + | width: 25%; | ||
| + | height: 15%; | ||
| + | margin-left: 35%; | ||
| + | } | ||
| + | } | ||
| + | |||
| + | @media screen and (max-width: 1100px ) { | ||
| + | .se-pre-con img { | ||
| + | margin-top: 20%; | ||
| + | height: 30%; | ||
| + | width: 50%; | ||
| + | margin-left: 25%; | ||
| + | } | ||
| + | } | ||
| + | |||
| + | @media screen and (max-width: 700px ) { | ||
| + | .se-pre-con img { | ||
| + | margin-top: 18%; | ||
| + | height: 20%; | ||
| + | } | ||
| + | } | ||
| + | </style> | ||
| + | </head> | ||
| + | <body> | ||
| + | <div class="se-pre-con"> | ||
| + | <img src="https://2019.igem.org/wiki/images/4/49/T--Tuebingen--DNA_gif.gif"> | ||
| + | </div> | ||
| + | <script src="https://2019.igem.org/Team:Tuebingen/jqueryLoadJS?action=raw&ctype=text/javascript"></script> | ||
| + | <script src="https://2019.igem.org/Team:Tuebingen/jmodernizerJS?action=raw&ctype=text/javascript"></script> | ||
| + | <script> | ||
| + | $(window).load(function () { | ||
| + | setTimeout(removeLoader, 1000); | ||
| + | }); //wait for page load PLUS one seconds. | ||
| + | function removeLoader() { | ||
| + | $(".se-pre-con").fadeOut(500, function () { | ||
| + | // fadeOut complete. Remove the loading div | ||
| + | $(".se-pre-con").remove(); //makes page more lightweight | ||
| + | }); | ||
| + | } | ||
| + | </script> | ||
| + | </body> | ||
<head> | <head> | ||
<meta charset="UTF-8"> | <meta charset="UTF-8"> | ||
Latest revision as of 20:43, 21 October 2019









































