title: Simple Off Canvas Menu Not Functioning
body: <p>I've created a simple main navigation, however it's not working when you click the menu button.  the code looks correct but maybe there is a disconnect I'm not seeing.  Any thoughts would be much appreciated.</p>
  
  <p>The site I am working on is: offcanvas.squarespace.com</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;a href="#main-navigation" class="menu-link"&gt;MENU&lt;/a&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>    #main-navigation.active {
          -webkit-transform: translate(-13.755em, 0px);
          -moz-transform: translate(-13.755em, 0px);
          -o-transform: translate(-13.755em, 0px);
          -ms-transform: translate(-13.755em, 0px);
          transform: translate(-13.755em, 0px);
  }
  
  .menu-link {
        position: absolute;
        top: 15px;
        left:10em;
        color:black;
        font-size: 24px;
  }
  </code></pre>
  
  <p>YUI</p>
  
  <pre><code>  Y.one('.menu-link').on('click', function(){
    Y.one('#main-navigation').toggleClass('active');
    Y.one('.container').toggleClass('active');
  </code></pre>