Question

我有一个手风琴滑块。滑块标签文本有问题，单击时不会滑动。 Here is the URL to my site.

文字的CSS：

.accordion label h7{ 
position: absolute;
cursor:pointer; 
display: block;
-webkit-backface-visibility: hidden; /* fixes chrome bug */
-webkit-transform: translateX(-100%) rotate(-90deg); 
-webkit-transform-origin: right top; 
-moz-transform: translateX(-100%) rotate(-90deg);
-moz-transform-origin: right top; 
-o-transform: translateX(-100%) rotate(-90deg); 
-o-transform-origin: right top; 
transform: translateX(-100%) rotate(-90deg); 
transform-origin: right top;
}

我错过了什么？他们是一种让滑块自动滑块有几秒滞后的方法吗？

Answer 1

问题是.accordion label h7设置为position:absolute。如果删除它，您会注意到文本开始滑动。

我找到的针对生成的文本的修复方法是将宽度设置为.accordion label h7。

.accordion label h7 {
    width: 200px;
}

Answer 2

文字正在滑动，但没有更新。一旦某些CSS属性发生变化，文本就会跳转到正确的位置。因此，在开始动画文本之前，可以尝试更改CSS属性，并在动画完成后再次将其删除（类似于没有人会看到的边框颜色）。（Relevant SO question）

标签上的文字单击时不滑动

2 个答案: