Team:UNIK Copenhagen/test

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<HTML><HEAD>
+
<html>
 +
<style type="text/css">
 +
#container{
 +
width:604px;
 +
height:453px;
 +
position:relative;
 +
}
 +
#container ul{
 +
width:604px;
 +
height:453px;
 +
list-style:none outside none;
 +
position:relative;
 +
overflow:hidden;
 +
}
 +
-
<script language="javascript">
+
#container li:first-child{
-
//
+
display:list-item;
-
    Titles=[ "can1",
+
position:absolute;
-
            "suc2",
+
}
-
            "FAB",
+
-
            "GFP",
+
-
            "ura3",
+
-
];
+
-
 
+
-
    var nCols = 1;             // Number of columns in the tables
+
-
    var bgColor = "white";    // Pop-up table background color
+
-
    var fgColor = "Black";      // Pop-up table text color
+
-
    Text = new Array(5);      // Array of arrays of pop-up table data
+
-
    Text[0] = new Array("can1 codes for a transporter that transport arginin and canavanin into the cell");
+
#container li{
-
    Text[1] = new Array("suc2 is a signal sequence that localizes the translation to ER");
+
position:absolute;
-
    Text[2] = new Array("the fab gene codes for the FAB fragment");
+
display:none;
-
    Text[3] = new Array("the gfp gene sodes for the gfp fragment");
+
}
-
    Text[4] = new Array("ura3 codes for an enzyme in the synthesis of uracil");
+
#container .prevButton{
 +
height:72px;
 +
width:68px;
 +
position:absolute;
 +
background:url('https://static.igem.org/mediawiki/2014/e/ed/Team_UNIK_Copenhagen_go_to_the_top.PNG') no-repeat;
 +
top:50%;
 +
margin-top:-36px;
 +
cursor:pointer;
 +
z-index:2000;
 +
background-position:left top;
 +
left:0
 +
}
-
function eShow(name)
+
#container .prevButton:hover{  
-
{
+
background-position:left bottom;left:0;}
-
    document.all(name).style.display = "inline";
+
</style>
-
}
+
-
function eHide(name)
+
-
{
+
-
    document.all(name).style.display = "none";
+
-
}
+
-
</script>
+
-
</head>
+
 +
<script>
 +
$(window).load(function(){
 +
var pages = $('#container li'), current=0;
 +
var currentPage,nextPage;
-
<BODY>
+
$('#container .button').click(function(){
-
<div style="position:relative">
+
currentPage= pages.eq(current);
-
<script language="javascript">
+
if($(this).hasClass('prevButton'))
-
    for (var j = 0; j < Titles.length; ++j)
+
{
-
    {
+
 
-
        name = Titles[j];
+
if (current <= 0)
-
        document.write(
+
current=pages.length-1;
-
        "<div style=\"position:absolute;top:5px;width:350px\">\n" +
+
else
-
        "    <table id=\"" + name + "\"" +
+
current=current-1;
-
        " cellpadding=1 cellspacing=4 border=2" +
+
}
-
        " bgColor=" + bgColor+ "\n style=" +
+
else
-
        "\"display:none; position:absolute; left:200px\">");
+
{
-
        document.write(
+
if (current >= pages.length-1)
-
            "<tr bgColor=" + bgColor+ ">");
+
current=0;
-
        document.write(
+
else
-
            "  <th bgColor=" + bgColor + " align=center>" +
+
current=current+1;
-
            " <font color=" + fgColor + ">About the sequence</font>");
+
}
-
        for (var i = 0; i < Text[j].length; i = i + nCols)
+
nextPage = pages.eq(current);
-
        {
+
currentPage.hide();
-
            if (Text[j][i] == 0)
+
nextPage.show();
-
            {
+
});
-
                document.write(
+
});
-
                "  <tr><td>" + Text[j][i] +
+
-
                "\n    <td align=\"center\">" + Text[j][i+1] +
+
-
                "\n    <td>" + Text[j][i+2] + "\n  </tr>");
+
-
            }
+
-
            else
+
-
            {
+
-
                document.write(
+
-
                "  <tr><td><b>" + Text[j][i] +
+
-
                "</b>\n    <td align=\"center\"><b>" + Text[j][i+1] +
+
-
                "</b>\n    <td><b>" + Text[j][i+2] + "</b>\n  </tr>");
+
-
            }
+
-
        }
+
-
        document.write("</table>");
+
-
        document.write("</div>");
+
-
    }
+
-
</script>
+
-
</div>
+
-
 
+
-
<table border="0">
+
-
<script language="javascript">
+
-
  for (var i = 0; i < Titles.length; ++i)
+
-
  {
+
-
    document.write("</td>\n<td><img src="https://static.igem.org/mediawiki/2014/b/bf/Team_UNIK_Copenhagen_Split_GFP_gene_1.PNG" border="0" onMouseOver=\"eShow(&quot;" + Titles[i] + "&quot;)\"");
+
-
    document.write("onMouseOut=\"eHide(&quot;" + Titles[i] + "&quot;)\">");
+
-
    document.write("<font color=\"#0000FF\" size=\"3\" face=\"Arial Unicode MS\">");
+
-
    for (var j = 0; j < Text[i].length; j = j + nCols)
+
-
    {
+
-
      if (j > 0)
+
-
      {
+
-
        document.write(", ");
+
-
      }
+
-
      else
+
-
      {
+
-
        document.write(Text[i][j]);
+
-
      }
+
-
    }
+
-
    document.write("\n</font></a></td></tr>")
+
-
  }
+
</script>
</script>
-
</table>
 
-
</BODY></HTML>
+
<div id="container">
 +
<ul>
 +
<li><img src="https://static.igem.org/mediawiki/2014/4/4f/Team_UNIK_Copenhagen_EASY_logo.PNG"></li>
 +
<li><img src="https://static.igem.org/mediawiki/2014/7/73/Team_UNIK_Copenhagen_green_lego_brick.PNG.jpg"></li>
 +
<li><img src="https://static.igem.org/mediawiki/2014/b/bf/Team_UNIK_Copenhagen_Split_GFP_gene_1.PNG"></li>
 +
</ul>
 +
<span class="button prevButton"></span>
 +
<span class="button nextButton"></span>
 +
</div>
 +
</html>

Revision as of 20:08, 6 August 2014