Difference between revisions of "Team:Cambridge-JIC/Templates/Menu"

(Mobile-compatible menu and footer)
Line 1: Line 1:
 
<html>
 
<html>
  
<!-- <meta name="viewport" content="user-scalable=1, width=700"> -->
+
<meta name="viewport" content="user-scalable=1, width=700">
 
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap.part0.css?action=raw&ctype=text/css" rel="stylesheet">
 
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap.part0.css?action=raw&ctype=text/css" rel="stylesheet">
 
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap.part1.css?action=raw&ctype=text/css" rel="stylesheet">
 
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap.part1.css?action=raw&ctype=text/css" rel="stylesheet">
Line 14: Line 14:
 
<link href="//2015.igem.org/wiki/images/3/3a/CamJIC-Favicon.png" rel="icon">
 
<link href="//2015.igem.org/wiki/images/3/3a/CamJIC-Favicon.png" rel="icon">
 
<script src="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap.js?action=raw&ctype=text/javascript"></script>
 
<script src="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap.js?action=raw&ctype=text/javascript"></script>
 +
 +
<script>
 +
function hndl(me) {
 +
    if($(me).parent().children("div").is(':visible')) {
 +
        $(".navsub_m").hide()
 +
    } else {
 +
        $(".navsub_m").hide()
 +
        $(me).parent().children("div").show()
 +
    }
 +
}
 +
 +
 +
$(window).ready(function(){
 +
 +
$(window).on("resize", function () {
 +
    if($(".navbar-toggle").is(":visible")) {
 +
        $(".navsub").each(function() {
 +
            $(this).removeClass("navsub");
 +
            $(this).addClass("navsub_m");
 +
            $(this).hide()
 +
            $(this).data("link", $(this).parent().children("a").attr("href"));
 +
            $(this).parent().children("a").attr("href", "#");
 +
            $(this).parent().children("a").attr("onclick", "hndl(this)");
 +
        })
 +
    } else {
 +
        $(".navsub_m").each(function(){
 +
            $(this).removeClass("navsub_m");
 +
            $(this).show()
 +
            $(this).addClass("navsub");
 +
            $(this).parent().children("a").attr("href", $(this).data("link"));
 +
            $(this).parent().children("a").attr("onclick", "");
 +
        })
 +
    }
 +
}).resize();
 +
});
 +
</script>
 +
 +
<style>
 +
.navsub_m {
 +
background: #333;
 +
text-align: center;
 +
}
 +
 +
.navsub_m ul {
 +
margin:0;
 +
padding:0;
 +
width: 100%;
 +
}
 +
 +
.navsub_m ul li {
 +
width: 100%;
 +
margin:0;
 +
display: inline-block;
 +
}
 +
 +
.navsub_m ul li a {
 +
padding: 10px 0px;
 +
width: 100%;
 +
display:block;
 +
}
 +
 +
.col-md-4 {
 +
text-align: center;
 +
margin-bottom: 40px;
 +
}
 +
 +
</style>
  
 
<div class="cam-container">
 
<div class="cam-container">

Revision as of 00:40, 28 July 2015