仅限CSS和HTML的选项卡未正确响应
仅限CSS和HTML的选项卡未正确响应
提问于 2013-03-21 19:37:22
这个问题真的让我很困惑。可能是我遗漏了一些简单的东西，但我肯定找不到……
我已经创建了一个fiddle来向您展示我正在谈论的内容。
你看，最初这有4个部分，这些滚动通过所有的链接正常工作。自那以后，客户端又添加了1个部分，现在由于某种原因，当我添加另一个无线链接时，幻灯片的整个控制都变得混乱了。See what I mean here.
我所添加的只是一个额外的链接和内容区域。有人知道我做错了什么吗？如果你从jsfiddle中删除下面的代码，你会看到它工作正常，但是有了标签5，它就放弃了。我不知所措...非常感谢您的帮助！
<input id="tab-5" type="radio" name="radio-set" class="tab-selector-5" /> <label for="tab-5" class="tab-label-5">POS</label>
<div class="content-5"> <h2>Fullfilment</h2> <p>Whatever your project involves Expressive Print are experienced in delivering it for you. From daily pick and pack requirements to contract packing and bulk despatches we have the ideal space to work in - clean, modern and secure premises with packing teams who are all fully CRB checked, robust stock control systems, comprehensive insurance cover and expertise. This ensures the right things are packed in the right order and sent the right people – simple but critical. Selecting a fulfilment partner who has strong systems with full accountability and customer service resource is vital to ensure your product’s success.</p> </div>回答 1
Stack Overflow用户
回答已采纳
发布于 2013-03-21 19:45:24
演示您的
现在，您只需在文件中添加一行css
.tabs input.tab-selector-1:checked ~ .content .content-1,
.tabs input.tab-selector-2:checked ~ .content .content-2,
.tabs input.tab-selector-3:checked ~ .content .content-3,
.tabs input.tab-selector-4:checked ~ .content .content-4,
.tabs input.tab-selector-5:checked ~ .content .content-5 // add this line in your css file
{
-webkit-transform: translateY(0px);
-moz-transform: translateY(0px);
-o-transform: translateY(0px);
-ms-transform: translateY(0px);
transform: translateY(0px);
z-index: 100;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
-webkit-transition: all ease-out 0.3s 0.3s;
-moz-transition: all ease-out 0.3s 0.3s;
-o-transition: all ease-out 0.3s 0.3s;
-ms-transition: all ease-out 0.3s 0.3s;
transition: all ease-out 0.3s 0.3s;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15546457
复制相关文章
相似问题
腾讯云开发者
