Zigapusnik (Talk | contribs) |
Zigapusnik (Talk | contribs) (Undo revision 233044 by Zigapusnik (talk)) |
||
Line 1: | Line 1: | ||
+ | {{Slovenia}} | ||
<html> | <html> | ||
− | + | <head> | |
− | < | + | <title>Home page</title> |
− | + | <script src="https://code.jquery.com/jquery-1.11.1.min.js" | |
− | / | + | integrity="sha256-VAvG3sHdS5LqTT+5A/aeq/bZGa/Uj04xKxY8KM/w9EE=" |
− | + | crossorigin="anonymous"></script> | |
− | + | <link rel="stylesheet" | |
− | + | href="https://igem2016.fri.uni-lj.si/index.php?title=Template:Slovenia/semantic.min.css&action=raw&ctype=text/css"> | |
− | + | <script type="text/javascript" | |
− | + | src="https://igem2016.fri.uni-lj.si/index.php?title=Template:Slovenia/semantic.min.js&action=raw&ctype=text/javascript"></script> | |
− | + | <link rel="stylesheet" type="text/css" href="//igem2016.fri.uni-lj.si/index.php?title=Custom.css&action=raw&ctype=text/css"> | |
− | / | + | <script type="text/javascript" src="https://igem2016.fri.uni-lj.si/index.php?title=Custom.js&action=raw&ctype=text/javascript"></script> |
− | + | <script type="text/javascript" | |
− | + | src="https://igem2016.fri.uni-lj.si/index.php?title=Zitator.js&action=raw&ctype=text/javascript"></script> | |
− | + | <!-- MathJax (LaTeX for the web) --> | |
− | + | <script type="text/x-mathjax-config"> | |
− | + | MathJax.Hub.Config({ | |
− | + | tex2jax: { | |
− | + | inlineMath: [['$', '$'], ['\\(', '\\)']] | |
− | + | }, | |
− | + | jax: ["input/TeX","output/SVG"], | |
− | + | TeX: { | |
− | + | extensions: ["mhchem.js"], | |
− | + | equationNumbers: {autoNumber: "all" }, | |
− | + | Macros: { | |
− | + | goodbreak: '\\mmlToken{mo}[linebreak="goodbreak"]{}', | |
− | + | badbreak: ['\\mmlToken{mo}[linebreak="badbreak"]{#1}',1], | |
− | + | nobreak: ['\\mmlToken{mo}[linebreak="nobreak"]{#1}',1], | |
− | + | invisibletimes: ['\\mmlToken{mo}{\u2062}'] | |
− | + | } | |
− | + | }, | |
− | + | CommonHTML: { linebreaks: { automatic: true, width: "75% container" } }, | |
− | + | "HTML-CSS": { linebreaks: { automatic: true, width: "68% container" }}, | |
− | + | SVG: { linebreaks: { automatic: true, width: "200% container" }} | |
− | + | }); | |
− | . | + | </script> |
− | + | <script type="text/javascript" async | |
− | + | src="//2016.igem.org/common/MathJax-2.5-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"> | |
− | + | </script> | |
− | + | </head> | |
− | + | <body> | |
− | + | <style> | |
− | + | .container { | |
− | + | position: relative; | |
− | + | } | |
− | + | .bottomLeft { | |
+ | position: absolute; | ||
+ | bottom: 100px; | ||
+ | left: 16px; | ||
+ | } | ||
− | + | /* Popup container - can be anything you want */ | |
− | + | .popup { | |
− | + | display: inline-block; | |
− | + | cursor: pointer; | |
− | + | -webkit-user-select: none; | |
− | + | -moz-user-select: none; | |
− | + | -ms-user-select: none; | |
− | + | user-select: none; | |
+ | } | ||
− | + | /* The actual popup */ | |
− | + | .popup .popuptext { | |
− | + | visibility: hidden; | |
− | + | width: 220px; | |
− | + | background-color: #555; | |
− | + | color: #fff; | |
− | + | text-align: center; | |
+ | border-radius: 6px; | ||
+ | padding: 8px 0; | ||
+ | position: absolute; | ||
+ | z-index: 100; | ||
+ | } | ||
− | + | /* Toggle this class - hide and show the popup */ | |
− | + | .popup .show { | |
− | + | visibility: visible; | |
− | + | -webkit-animation: fadeIn 1s; | |
− | + | animation: fadeIn 1s; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | /* Add animation (fade in the popup) */ | |
− | + | @-webkit-keyframes fadeIn { | |
+ | from {opacity: 0;} | ||
+ | to {opacity: 1;} | ||
} | } | ||
− | + | @keyframes fadeIn { | |
− | + | from {opacity: 0;} | |
− | + | to {opacity:1 ;} | |
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | .container img{ | |
− | + | display: block; | |
− | + | margin-left: auto; | |
− | + | margin-right: auto; | |
− | $( | + | } |
− | + | ||
− | + | </style> | |
− | + | <script> | |
− | + | $( document ).ready( | |
− | + | function() { | |
− | + | var getImgs = function() { | |
− | + | var imgs = []; | |
− | + | $('img').each(function() { | |
− | + | console.log("image detected"); | |
+ | var data = $(this).data('alt'); | ||
+ | imgs.push(data); | ||
+ | }); | ||
+ | return imgs; | ||
+ | } | ||
+ | var imgs = getImgs(); | ||
+ | //preload images | ||
+ | var image = []; | ||
+ | $.each(imgs, function(index) { | ||
+ | console.log("loading resource"); | ||
+ | image[index] = new Image(); | ||
+ | image[index].src = imgs[index]; | ||
+ | }); | ||
} | } | ||
− | + | ); | |
− | + | function loadImage(sourceImage, popupname) { | |
− | + | console.log(sourceImage); | |
− | + | var image = document.getElementById("projectScheme"); | |
− | // | + | image.src = sourceImage; |
− | + | ||
− | + | //var rect = image.getBoundingClientRect(); | |
− | + | //console.log(rect.top, rect.right, rect.bottom, rect.left); | |
− | + | ||
− | + | var popup = document.getElementById(popupname); | |
− | + | //popup.style.top = ((rect.bottom - rect.top)/2).toString().concat("px"); | |
− | + | //popup.style.left = ((rect.right - rect.left)/2).toString().concat("px"); | |
− | } | + | //console.log((rect.right - rect.left)/2, (rect.bottom - rect.top)/2); |
− | + | popup.classList.toggle('show'); | |
− | + | } | |
− | + | </script> | |
− | + | ||
− | + | <div id="example"> | |
− | + | <div class="pusher"> | |
− | + | <div class="full height"> | |
− | + | <div class="banana"> | |
− | / | + | <a href = "//igem2016.fri.uni-lj.si/index.php/Team:Slovenia"> |
− | + | <img class="ui medium sticky image" src="//igem2016.fri.uni-lj.si/img_auth.php/5/58/Slog%26logo.png"> | |
− | + | </a> | |
− | + | <div class="ui vertical sticky text menu" style="background-color: transparent; padding-top: 80px; margin-left: 10px"> | |
− | + | <a class="item" href=""> | |
− | + | <i class="chevron circle left icon"></i> | |
− | + | <b>Human practices</b> | |
− | + | </a> | |
− | + | <a class="item" href="" style="margin-left: 10%"> | |
− | + | <i class="selected radio icon"></i> | |
− | + | <b>Safety</b> | |
− | </ | + | </a> |
− | + | <a class="item" href=""> | |
− | + | <i class="chevron circle right icon"></i> | |
+ | <b>Sponsors</b> | ||
+ | </a> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div class="article" id="context"> | ||
+ | <!-- menu goes here --> | ||
+ | <!-- content goes here --> | ||
+ | <div class="main ui citing justified container"> | ||
+ | <!-- <div class="ui two column grid"> | ||
+ | <div class="ui eight wide column"> | ||
+ | <img class="ui centered image" | ||
+ | src="https://igem2016.fri.uni-lj.si/img_auth.php/2/21/13521771_1756491854619523_237846538_n.jpg"> | ||
+ | </div> | ||
+ | <div class="ui eight wide column"> | ||
+ | <h1 class="ui centered dividing header"><span> </span>Project description</h1> | ||
+ | <p class="ui fluid segment text container"> | ||
+ | In the past years of iGEM and synthetic biology a lot of projects have been devoted to the development of | ||
+ | synthetic genetic circuits and logic gates. Most of those were based on transcription regulation, however | ||
+ | this mechanism is relatively slow and the final output can be detected only after several hours or days.<br> | ||
+ | This year team Slovenia has decided to tackle the problem of the design of fast logic circuits. We plan to | ||
+ | introduce new protein-based sensors that will allow cells to quickly respond to input signals such as light | ||
+ | stimulation or chemical dimerizers and produce outputs that could potentially be used for therapeutic | ||
+ | treatment. | ||
+ | </p> | ||
+ | </div> | ||
+ | </div> --> | ||
+ | <h1 class="ui centered dividing header"><span id="intro" class = "section"> </span>Project</h1> | ||
+ | <div class = "container"> | ||
+ | <img width = "800px" style = "border-radius: 15px;" src="//igem2016.fri.uni-lj.si/img_auth.php/d/da/Main-scheme0.png" alt="project scheme" usemap="#projectmap" id = "projectScheme"></img> | ||
+ | <map name="projectmap"> | ||
+ | <area class="popup" shape="poly" coords="74, 132, 136, 217, 241, 225, 319, 175, 365, 89, 298, 42, 152, 62" alt="module1" onmouseover="loadImage('//igem2016.fri.uni-lj.si/img_auth.php/9/92/Main-scheme1.png', 'module1')" onmouseout="loadImage('//igem2016.fri.uni-lj.si/img_auth.php/d/da/Main-scheme0.png', 'module1')" href="resultsModule1.html"></area> | ||
+ | <area class="popup" shape="poly" coords="387, 125, 393, 283, 423, 316, 518, 190, 486, 120" alt="module1" onmouseover="loadImage('//igem2016.fri.uni-lj.si/img_auth.php/2/2a/Main-scheme3.png', 'module2')" onmouseout="loadImage('//igem2016.fri.uni-lj.si/img_auth.php/d/da/Main-scheme0.png', 'module2')" href="resultsModule2.html"></area> | ||
+ | <area class="popup" shape="poly" coords="528, 77, 497, 134, 537, 173, 672, 185, 739, 145, 733, 94, 694, 71" alt="module1" onmouseover="loadImage('//igem2016.fri.uni-lj.si/img_auth.php/2/2e/Main-scheme2.png', 'module3')" onmouseout="loadImage('//igem2016.fri.uni-lj.si/img_auth.php/d/da/Main-scheme0.png', 'module3')" href="resultsModule3.html"></area> | ||
+ | <area class="popup" shape="poly" coords="393, 283, 423, 316, 454, 300, 474, 260, 537, 273, 494, 305, 678, 285, 697, 243, 788, 239, 788, 330, 383, 374, 343, 319" alt="module1" onmouseover="loadImage('//igem2016.fri.uni-lj.si/img_auth.php/3/39/Main-scheme4.png', 'module4')" onmouseout="loadImage('//igem2016.fri.uni-lj.si/img_auth.php/d/da/Main-scheme0.png', 'module4')" href="resultsModule4.html"></area> | ||
+ | </map> | ||
+ | <div class="popup bottomLeft"> | ||
+ | <span class="popuptext" id="module1">Module 1 some text <br/> some other text</span> | ||
+ | </div> | ||
+ | <div class="popup bottomLeft"> | ||
+ | <span class="popuptext" id="module2">Module 2 some text <br/> some other text</span> | ||
+ | </div> | ||
+ | <div class="popup bottomLeft"> | ||
+ | <span class="popuptext" id="module3">Module 3 some text <br/> some other text</span> | ||
+ | </div> | ||
+ | <div class="popup bottomLeft"> | ||
+ | <span class="popuptext" id="module4">Module 4 some text <br/> some other text</span> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <h1 class="ui centered dividing header"><span id="achievements" class = "section"> </span>Achievements</h1> | ||
+ | <h1 class="ui centered dividing header"><span id="requirements" class = "section"> </span>Medal requirements</h1> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </body> | ||
</html> | </html> |
Revision as of 08:36, 14 October 2016