android - 使用复选框显示导航（内容）在 Android 上不起作用

Question

我有以下设置（在窄窗口中查看，<750px 宽）：http ://codepen.io/darrylhein/pen/oFalc

问题是导航的隐藏/显示在 Android 的默认浏览器中不起作用。它似乎在其他任何地方都有效。（它确实适用于 Android 上的 Firefox。）

基本上我input:checked ~ .class { height: 16em; }用来显示导航。

我试过删除过渡和其他各种东西，但它似乎不起作用。

有任何想法吗？

我想避免使用 JS，但如果必须，我会的。

score 0 · Accepted Answer

因此，解决方案有 2 个部分：

1) Android <4.1.2 出现问题。解决方案是在 body 上添加一个假动画：

body { -webkit-animation: bugfix infinite 1s; }
@-webkit-keyframes bugfix { 
    from { padding:0; }
    to { padding:0; }
}

2) iOS <6 上还有一个问题，标签不选中复选框。解决方案是将一个添加onclick到label：

<label for="checkbox" onclick>Menu</label>

我在这里找到了解决方案：http: //timpietrusky.com/advanced-checkbox-hack

1 回答 1