|
|
Line 1: |
Line 1: |
− | <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>
| |