2

我尝试创建一个redmine CSS only 主题，隐藏属性部分，仅在鼠标单击或触摸时显示。

我添加了在台式机上运行良好的伪类 :active，但在 Android Chrome 上，它只激活了几分之一秒，然后又失去了这个属性（因为它开始选择复制和粘贴）

.details > .attributes {
        height:20px;
        overflow:hidden;
        display: block;
        cursor:pointer;
}
.details > .attributes:hover {
        background-color:#ddd;
}
.details > .attributes:active, .details > .attributes:focus {
        height:auto;
}

（在这里我也添加了:focus属性，但这并没有改变任何东西）

如何在不编辑 html 代码且不使用 javascript 的情况下绕过它？

4

1 回答 1

0

作为一种解决方法，我现在添加了一个过渡并保持打开状态:hover：

.details > .attributes {
        height:20px;
        overflow:hidden;
        display: block;
        cursor:pointer;
}
.details > .attributes:hover {
        background-color:#ddd;
}
.details > .attributes:active, .details > .attributes:hover {
        height:120px;
        overflow:auto;
        transition: height 1.1s ease-in;
}

这只是一种解决方法，因为这不起作用，height:auto因为无法从height:20pxto过渡height:auto。我定义了 120px，这在大多数情况下似乎已经足够了，但如果它不适合，overflow: auto 将在 div 的一侧显示一个 sclŕollbar（这是可以接受的）

于 2015-06-02T09:37:13.810 回答