title: open menu while clicking on checkbox
body: <p>hey there i created this checkbox in comobination with a menu:</p>
  
  <pre><code>&lt;input type='checkbox' name='thing' value='valuable' id="thing"/&gt;&lt;label for="thing"&gt;&lt;/label&gt; 
  
          &lt;ul class="sub-nav"&gt;
                  &lt;li&gt;Johnny&lt;/li&gt;
                  &lt;li&gt;Julie&lt;/li&gt;
                  &lt;li&gt;Jamie&lt;/li&gt;
          &lt;/ul&gt;  
  </code></pre>
  
  <p>style :</p>
  
  <pre><code>input[type=checkbox] {
  display:none;
  }
  
  input[type=checkbox] + label
  {
  background: #999;
  height: 16px;
  width: 16px;
  display:inline-block;
  padding: 0 0 0 0px;
  }
  input[type=checkbox]:checked + label
  {
  background: #0080FF;
  height: 16px;
  width: 16px;
  display:inline-block;
  padding: 0 0 0 0px;
  }
  .sub-nav {
      display: none;
  }
  input[type=checkbox]:checked &gt; .sub-nav {
      display: block;
      position: absolute;
      top: 100px;
      left: 0;
      z-index: 99999;
      width: 100px;
      height: 100px;
      background-color: red;
  }
  </code></pre>
  
  <p>the demo: <a href="http://jsfiddle.net/4huzr/71/" rel="nofollow">http://jsfiddle.net/4huzr/71/</a></p>
  
  <p>i want the sub-menu to open when you click at the grey checkbox(when you click again it should hide), but this sample doesnt work, anybody can help? </p>