Team:Hong Kong-CUHK/project.html

From 2014.igem.org

(Difference between revisions)
Line 28: Line 28:
     <div class="row row-centered">
     <div class="row row-centered">
         <a id="projectAEntry" class="col-xs-6 col-centered" href="#">
         <a id="projectAEntry" class="col-xs-6 col-centered" href="#">
-
             <img src="http://placehold.it/300x300" class="img-responsive center-block">
+
             Nitrogen-repressible T7 expression system
         </a>
         </a>
         <a id="projectBEntry" class="col-xs-6 col-centered" href="#">
         <a id="projectBEntry" class="col-xs-6 col-centered" href="#">
-
             <img src="http://placehold.it/300x300" class="img-responsive center-block">
+
             ScLCD- Saccharomyces cerevisiae Liquid Chip Display
         </a>
         </a>
     </div>
     </div>
Line 43: Line 43:
<script type="text/javascript">
<script type="text/javascript">
var projectAContent = [{
var projectAContent = [{
-
     "content": "project-1.html?action=raw&ctype=text/html"
+
     "content": "projectA-background.html?action=raw&ctype=text/html"
}, {
}, {
-
     "content": "project-2.html?action=raw&ctype=text/html"
+
     "content": "projectA-biobricks.html?action=raw&ctype=text/html"
}, {
}, {
-
     "content": "project-3.html?action=raw&ctype=text/html"
+
     "content": "modelling.html?action=raw&ctype=text/html"
}, {
}, {
-
     "content": "project-4.html?action=raw&ctype=text/html"
+
     "content": "projectA-result.html?action=raw&ctype=text/html"
-
}, {
+
-
    "content": "project-5.html?action=raw&ctype=text/html"
+
}];
}];
Line 90: Line 88:
$('#projectAEntry').click(function(e){
$('#projectAEntry').click(function(e){
 +
    console.log('A');
     $('#projectChoice').hide();
     $('#projectChoice').hide();
     $('#btn-next').show();
     $('#btn-next').show();
Line 96: Line 95:
$('#projectBEntry').click(function(e){
$('#projectBEntry').click(function(e){
 +
    console.log('B');
     $('#projectChoice').hide();
     $('#projectChoice').hide();
     $('#btn-next').show();
     $('#btn-next').show();

Revision as of 03:56, 18 October 2014

<style type="text/css"> /* Next Button */

  1. btn-next {
   position: fixed;
   right: 10px;
   bottom: 50px;
   z-index: 999;

}

  1. btn-next a {
   background-image: url('https://static.igem.org/mediawiki/2014/1/1e/Btn-Next.png');
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center bottom;
   margin-bottom: -40px;
   width: 50px;
   height: 50px;
   display: block;

}

  1. btn-next a:hover {
   background-image: url('https://static.igem.org/mediawiki/2014/1/1e/Btn-Next.png');
   width: 119px;
   height: 200px;

} </style>

       <a id="projectAEntry" class="col-xs-6 col-centered" href="#">
           Nitrogen-repressible T7 expression system
       </a>
       <a id="projectBEntry" class="col-xs-6 col-centered" href="#">
           ScLCD- Saccharomyces cerevisiae Liquid Chip Display
       </a>

<script type="text/javascript"> var projectAContent = [{

   "content": "projectA-background.html?action=raw&ctype=text/html"

}, {

   "content": "projectA-biobricks.html?action=raw&ctype=text/html"

}, {

   "content": "modelling.html?action=raw&ctype=text/html"

}, {

   "content": "projectA-result.html?action=raw&ctype=text/html"

}];

var projectBContent = [{

   "content": "project-1.html?action=raw&ctype=text/html"

}, {

   "content": "project-2.html?action=raw&ctype=text/html"

}, {

   "content": "project-3.html?action=raw&ctype=text/html"

}, {

   "content": "project-4.html?action=raw&ctype=text/html"

}, {

   "content": "project-5.html?action=raw&ctype=text/html"

}];

function loadContent(projectContent) { var deferreds = []; $.each(projectContent, function(index, value) {

   deferreds.push(
       $.get(value['content'], function(data) {
           value['loadedContent'] = data;
       })
   );

});

$.when.apply(null, deferreds).done(function() {

   projectCurrentPageIndex = 0;
   $('#project-content').html(projectContent[projectCurrentPageIndex]['loadedContent']);
   $('#btn-next').click(function() {
       if (projectCurrentPageIndex + 1 < projectContent.length) {
           projectCurrentPageIndex++;
           $('#project-content').html(projectContent[projectCurrentPageIndex]['loadedContent']);
       }
   });

}); }

$('#projectAEntry').click(function(e){

   console.log('A');
   $('#projectChoice').hide();
   $('#btn-next').show();
   loadContent(projectAContent);

});

$('#projectBEntry').click(function(e){

   console.log('B');
   $('#projectChoice').hide();
   $('#btn-next').show();
   loadContent(projectBContent);

}); </script>