Team:Hong Kong-CUHK/home.html

From 2014.igem.org

(Difference between revisions)
m (formatting and pics link updated)
m
 
(11 intermediate revisions not shown)
Line 44: Line 44:
     background-image: url('https://static.igem.org/mediawiki/2014/thumb/b/b8/Rail-line.png/800px-Rail-line.png');
     background-image: url('https://static.igem.org/mediawiki/2014/thumb/b/b8/Rail-line.png/800px-Rail-line.png');
     background-repeat: repeat-x;
     background-repeat: repeat-x;
-
     background-size: contain;
+
     background-size: auto 100%;
}
}
#train {
#train {
Line 54: Line 54:
     background-image: url('https://static.igem.org/mediawiki/2014/thumb/f/ff/Train.png/800px-Train.png');
     background-image: url('https://static.igem.org/mediawiki/2014/thumb/f/ff/Train.png/800px-Train.png');
     background-size: contain;
     background-size: contain;
 +
    background-position-y: 85px;
     background-repeat: no-repeat;
     background-repeat: no-repeat;
}
}
Line 59: Line 60:
     display: inline-block;
     display: inline-block;
     position: absolute;
     position: absolute;
-
     border: 1px solid red;
+
     /*border: 1px solid red;*/
}
}
body {
body {
     background-color: #FFFFFF;
     background-color: #FFFFFF;
-
     background-image: url('https://static.igem.org/mediawiki/2014/e/ea/Cuhk-bg.png');
+
     background-image: url('https://static.igem.org/mediawiki/2014/f/f0/Menu-bg.jpg');
}
}
 +
#widthWrapper {
 +
    min-width: 1200px;
 +
}
 +
.container-fluid,
.container {
.container {
 +
    padding: 0;
 +
}
 +
.row {
 +
    margin: 0;
 +
}
 +
.navbar-header {
 +
    margin-left: 0 !important;
 +
    margin-right: 0 !important;
 +
    float: left !important;
 +
}
 +
.navbar-brand {
 +
    margin-left: 0px !important;
 +
}
 +
.navbar {
 +
    min-width: 1200px;
 +
    overflow: hidden;
 +
}
 +
.navbar .container {
     margin-left: 20px;
     margin-left: 20px;
 +
    min-width: 1170px;
 +
}
 +
.content-wrapper {
 +
    top: 0px;
 +
    left: 0px;
 +
    position: relative;
 +
    width: 100%;
}
}
#footer-box {
#footer-box {
Line 104: Line 134:
<script type="text/javascript">
<script type="text/javascript">
 +
var generalSubTopic = [{
 +
    "id": "link-offical",
 +
    "background": "url('https://static.igem.org/mediawiki/2014/5/5f/Cloud1.png')",
 +
    "width": 100,
 +
    "height": 45,
 +
    "offset": {
 +
        "left": 150,
 +
        "top": 10,
 +
    }
 +
}, {
 +
    "id": "link-ours",
 +
    "background": "url('https://static.igem.org/mediawiki/2014/5/5f/Cloud1.png')",
 +
    "width": 100,
 +
    "height": 45,
 +
    "offset": {
 +
        "left": 400,
 +
        "top": 10,
 +
    }
 +
}];
 +
var teamSubTopic = [{
var teamSubTopic = [{
     "id": "link-offical",
     "id": "link-offical",
Line 153: Line 203:
     "id": "link-home",
     "id": "link-home",
     "content": "home-1.html?action=raw&ctype=text/html",
     "content": "home-1.html?action=raw&ctype=text/html",
 +
    "subtopic": generalSubTopic,
     "width": 135,
     "width": 135,
     "height": 130,
     "height": 130,
Line 162: Line 213:
     "id": "link-team",
     "id": "link-team",
     "content": "team.html?action=raw&ctype=text/html",
     "content": "team.html?action=raw&ctype=text/html",
-
     "subtopic": teamSubTopic,
+
     "subtopic": generalSubTopic,
     "width": 90,
     "width": 90,
     "height": 75,
     "height": 75,
Line 172: Line 223:
     "id": "link-project",
     "id": "link-project",
     "content": "project.html?action=raw&ctype=text/html",
     "content": "project.html?action=raw&ctype=text/html",
 +
    "subtopic": generalSubTopic,
     "width": 90,
     "width": 90,
     "height": 75,
     "height": 75,
Line 181: Line 233:
     "id": "link-biobricks",
     "id": "link-biobricks",
     "content": "biobricks.html?action=raw&ctype=text/html",
     "content": "biobricks.html?action=raw&ctype=text/html",
 +
    "subtopic": generalSubTopic,
     "width": 90,
     "width": 90,
     "height": 75,
     "height": 75,
Line 190: Line 243:
     "id": "link-modelling",
     "id": "link-modelling",
     "content": "modelling.html?action=raw&ctype=text/html",
     "content": "modelling.html?action=raw&ctype=text/html",
 +
    "subtopic": generalSubTopic,
     "width": 90,
     "width": 90,
     "height": 75,
     "height": 75,
Line 199: Line 253:
     "id": "link-human-practice",
     "id": "link-human-practice",
     "content": "humanpractice.html?action=raw&ctype=text/html",
     "content": "humanpractice.html?action=raw&ctype=text/html",
 +
    "subtopic": generalSubTopic,
     "width": 90,
     "width": 90,
     "height": 75,
     "height": 75,
Line 218: Line 273:
     "id": "link-documentation",
     "id": "link-documentation",
     "content": "documentation.html?action=raw&ctype=text/html",
     "content": "documentation.html?action=raw&ctype=text/html",
 +
    "subtopic": generalSubTopic,
     "width": 102,
     "width": 102,
     "height": 75,
     "height": 75,
Line 227: Line 283:
     "id": "link-acknowledgement",
     "id": "link-acknowledgement",
     "content": "acknowledgement.html?action=raw&ctype=text/html",
     "content": "acknowledgement.html?action=raw&ctype=text/html",
 +
    "subtopic": generalSubTopic,
     "width": 121,
     "width": 121,
     "height": 75,
     "height": 75,
Line 240: Line 297:
};
};
-
function makelink(picset, wrapper, isAnimated, callbackClick, callbackHover) {
+
function makelink(picset, wrapper, defaultPage, isAnimated, callbackClick, callbackHover) {
-
 
+
     var deferreds = [];
     var deferreds = [];
     $.each(picset, function(index, value) {
     $.each(picset, function(index, value) {
Line 273: Line 329:
             if (value['background'] != null) {
             if (value['background'] != null) {
                 link = link.css('background', value['background']);
                 link = link.css('background', value['background']);
 +
                link = link.css('background-repeat', 'no-repeat');
             }
             }
Line 286: Line 343:
                     .animate({
                     .animate({
                         top: value['offset']['top']
                         top: value['offset']['top']
-
                     }, 1000, 'linear')
+
                     }, 250, 'linear')
                     .animate({
                     .animate({
                         left: value['offset']['left']
                         left: value['offset']['left']
Line 295: Line 352:
             wrapper.append(link);
             wrapper.append(link);
 +
 +
            if (value['id'] == defaultPage) {
 +
                callbackHover(value);
 +
                callbackClick(value);
 +
            }
         });
         });
     });
     });
 +
}
 +
 +
function getQueryString(key) {
 +
    var query = window.location.search.substring(1);
 +
    var vars = query.split("&");
 +
    for (var i = 0; i < vars.length; i++) {
 +
        var pair = vars[i].split("=");
 +
        if (pair[0] == key) {
 +
            return pair[1];
 +
        }
 +
    }
 +
    return null;
 +
}
 +
 +
function getWindowWidth() {
 +
    if (document.documentElement) {
 +
        if (document.documentElement.clientWidth) {
 +
            return document.documentElement.clientWidth;
 +
        }
 +
    }
 +
 +
    if (document.body) {
 +
        if(document.body.clientWidth) {
 +
            return document.body.clientWidth;   
 +
        }
 +
    }
 +
    return 0;
}
}
$(document).ready(function() {
$(document).ready(function() {
 +
    var page = getQueryString('page');
-
     makelink(wikiContent, $('#train-link'), false, function(value) {
+
     makelink(wikiContent, $('#train-link'), page, false, function(value) {
         if (value['loadedContent'] != null)
         if (value['loadedContent'] != null)
             $('#wiki-content').html(value['loadedContent']);
             $('#wiki-content').html(value['loadedContent']);
Line 325: Line 415:
             $("#traffic-light").hide();
             $("#traffic-light").hide();
         }
         }
 +
 +
        $('.content-wrapper').css({
 +
            'left': Math.min($(this).scrollLeft(), $('.navbar').width() - getWindowWidth())
 +
        });
 +
        e.preventDefault();
     });
     });
});
});
Line 330: Line 425:
<body>
<body>
-
     <div class="navbar" style="background-image: url('https://static.igem.org/mediawiki/2014/f/f0/Menu-bg.jpg') ">
+
     <div id="widthWrapper">
-
        <div class="container">
+
        <div class="container-fluid">
-
            <div class="navbar-header">
+
            <div class="navbar" style="background-image: url('https://static.igem.org/mediawiki/2014/e/ea/Cuhk-bg.png') ">
-
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".nav-collapse">
+
                <div class="container">
-
                    <span class="icon-bar"></span>
+
                    <div class="navbar-header">
-
                    <span class="icon-bar"></span>
+
                        <a class="navbar-brand" herf="https://2014.igem.org/">
-
                    <span class="icon-bar"></span>
+
                            <img src="https://static.igem.org/mediawiki/2014/3/30/Igemlogocuhk.png" height="50px" align="right">
-
                </button>
+
                        </a>
 +
                        <br>
 +
                        <a class="navbar-brand" href="https://2014.igem.org/Team:Hong_Kong-CUHK">
 +
                            <img src="https://static.igem.org/mediawiki/2014/thumb/4/49/CUHKwikiLogo.png/600px-CUHKwikiLogo.png" height="130">
 +
                        </a>
-
                <a class="navbar-brand" herf="https://2014.igem.org/">
+
                     </div>
-
                     <img src="https://static.igem.org/mediawiki/2014/3/30/Igemlogocuhk.png" height="50px" align="right">
+
                     <div class="col-xs-10">
-
                </a>
+
                        <div class="row">
-
                <br>
+
                            <div id="train">
-
                <a class="navbar-brand" href="https://2014.igem.org/Team:Hong_Kong-CUHK">
+
                                <div id="train-link"></div>
-
                     <img src="https://static.igem.org/mediawiki/2014/thumb/4/49/CUHKwikiLogo.png/600px-CUHKwikiLogo.png" height="130">
+
                                <div id="train-sublink"></div>
-
                </a>
+
                            </div>
-
 
+
                        </div>
-
            </div>
+
-
            <div class="col-md-10">
+
-
                <div class="row">
+
-
                    <div id="train">
+
-
                        <div id="train-link"></div>
+
-
                        <div id="train-sublink"></div>
+
                     </div>
                     </div>
                 </div>
                 </div>
 +
                <div id="navbar-separator" style="background-color: #ffffff;"></div>
             </div>
             </div>
         </div>
         </div>
-
        <div id="navbar-separator" style="background-color: #ffffff;"></div>
 
     </div>
     </div>
     <div id="traffic-light">
     <div id="traffic-light">
         <a href="#">&nbsp;</a>
         <a href="#">&nbsp;</a>
     </div>
     </div>
-
     <div class="row">
+
     <div class="container">
-
 
+
         <div class="row">
-
         <div id="wrapper" class="center-block">
+
             <div id="wiki-content"></div>
-
 
+
-
             <div id="content-wrapper" class="col-xs-10 col-xs-offset-1">
+
-
                <div id="wiki-content"></div>
+
-
            </div>
+
         </div>
         </div>
-
        <div id="top-bar"></div>
 
     </div>
     </div>
</body>
</body>
</html>
</html>

Latest revision as of 18:18, 22 November 2014

 

Retrieved from "http://2014.igem.org/Team:Hong_Kong-CUHK/home.html"