Difference between revisions of "Template:SJTU-BioX-Shanghai/Alpha/Header"

Line 2: Line 2:
  
 
<script>
 
<script>
−
function hide_nav_click(btn) {
+
function toggle_nav(btn) {
 
   btn.onclick = function(){show_nav_click(this)}
 
   btn.onclick = function(){show_nav_click(this)}
 
   var ctt = $('#content')[0]
 
   var ctt = $('#content')[0]
−
   ctt.classList.add('nav-toggle')
+
   ctt.classList.toggle('nav-toggle')
−
  var svg = btn.firstChild;
+
−
  svg.transform.baseVal[0].matrix.a = -1
+
−
  svg.transform.baseVal[0].matrix.e = 10
+
−
}
+
−
function show_nav_click(btn) {
+
−
  btn.onclick = function(){hide_nav_click(this)}
+
−
  var ctt = $('#content')[0]
+
−
  ctt.classList.remove('nav-toggle')
+
−
  var svg = btn.firstChild;
+
−
  svg.transform.baseVal[0].matrix.a = 1
+
−
  svg.transform.baseVal[0].matrix.e = 0
+
 
}
 
}
 
</script>
 
</script>
Line 104: Line 93:
 
   width: 15em;
 
   width: 15em;
 
   font-size: 0.6em;
 
   font-size: 0.6em;
 +
}
 +
#toc * {
 +
  margin-top: 0px;
 +
  margin-bottom: 0px;
 
}
 
}
 
#toc ul ul {
 
#toc ul ul {
 
   margin-left: 0px;
 
   margin-left: 0px;
 
}
 
}
−
#toc ul ul li {
+
#toc a {
 
   padding-left: 1em;
 
   padding-left: 1em;
 
}
 
}
Line 137: Line 130:
 
.nav-toggle nav {
 
.nav-toggle nav {
 
   left: -15em;
 
   left: -15em;
 +
}
 +
 +
nav svg {
 +
  transform: matrix(1,0,0,1,0,0);
 +
}
 +
.nav-toggle nav svg {
 +
  transform: matrix(-1,0,0,1,10,0);
 
}
 
}
 
nav > * {
 
nav > * {
Line 237: Line 237:
  
 
     <nav>
 
     <nav>
−
       <div id="hide-nav" onclick="hide_nav_click(this)"><svg transform="matrix(1,0,0,1,0,0)" width="10px" height="40px"><polygon points="10,0 0,20 10,40"/></svg></div>
+
       <div id="hide-nav" onclick="toggle_nav(this)"><svg width="10px" height="40px"><polygon points="10,0 0,20 10,40"/></svg></div>
 
       <ul>
 
       <ul>
 
<li><a href="#">home</a></li>
 
<li><a href="#">home</a></li>

Revision as of 08:22, 16 August 2015