复选框触发一个隐藏的div，从另一个div

Question

女士们，先生们。我用这个可爱的CSS只需滑动全屏幕导航菜单即可付费。一切都是桃子，直到我尝试移动触发菜单的复选框。

您看到该复选框在其直接倾倒在页面正文中时可以使用。但是，只要我把它放入div中，它就不会。

Fiddle with my fiddle.看看它不工作，但如果您将复选框移出“im-my-own-div”，它就可以工作！

我相信这是负责隐藏和显示导航标记的代码。

<input type="checkbox" id="nav"> 
<label for="nav" class="entypo-menu"></label> 

和

input[id*="nav"]:checked ~ nav { 
    transform: translate3d(0,0,0); 
} 

在进一步检查它似乎只当NAV类上面直接放置到工作。即使复选框位于页面其他地方的另一个div内，是否有办法让它到达导航div。

Answer 1

你不能因为使用选择器的类型。

Tilde选择通用的同级。 （在你的情况下，“导航”）

只能与孩子或sibilings在CSS工作， 你可以爬不回：父母小号

你可以在JS做到这一点。

What does the "~" (tilde/squiggle/twiddle) CSS selector mean?

至于建议（@GCyrillus）您可以将外部的输入：

<input type="checkbox" id="nav"> 
<div id="im-my-own-div"> 
<label for="nav" class="entypo-menu"></label> 
</div>