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

Line 4: Line 4:
 
function hide_nav_click(btn) {
 
function hide_nav_click(btn) {
 
   alert('hide')
 
   alert('hide')
   btn.onclick = "show_nav_click(this)"
+
   btn.onclick = "alert(show)"
 
   var nav = btn.parentNode;
 
   var nav = btn.parentNode;
 
   var svg = btn.firstChild;
 
   var svg = btn.firstChild;
 
   nav.classList.add('nav-hided')
 
   nav.classList.add('nav-hided')
 +
  svg.transform.baseVal[0].matrix.a = -1
 +
  svg.transform.baseVal[0].matrix.e = 10
 
   console.log(svg)
 
   console.log(svg)
 
}
 
}
Line 104: Line 106:
 
}
 
}
 
nav.nav-hided {
 
nav.nav-hided {
   width: 0px;
+
   left: -15em;
 
}
 
}
  
Line 184: Line 186:
 
/* animation BEGIN */
 
/* animation BEGIN */
 
nav {
 
nav {
   transition: width 0.4s;
+
   transition: left 0.4s;
 
}
 
}
  
Line 205: Line 207:
 
     <nav>
 
     <nav>
 
       <div>SJTU Bio-X</div>
 
       <div>SJTU Bio-X</div>
       <div id="hide-nav" onclick="hide_nav_click(this)"><svg transform="matrix(1,0,0,-1,0,10)" width="10px" height="40px"><polygon points="10,0 0,20 10,40"/></svg></div>
+
       <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>
 
       <ul>
 
       <ul>
 
<li><a href="#">home</a></li>
 
<li><a href="#">home</a></li>

Revision as of 01:22, 11 August 2015