Question

我拼凑了两个教程来创建一个CSS滑块。每张幻灯片都是一个列表项，带有背景图像，一些文本和一个链接。问题是所有五个幻灯片链接到最后一张幻灯片的链接。请帮忙！

            <ul class="slideshow">
            <li><div class="slider-cta"><a href="what-we-buy.php"><h3>What We Buy</h3><p>From IT Networking to Test Equipment to medical equipment. We buy broad range of tech equipment.</p><p class="slider-button">See the full list here</p></a></div></li>
            <li><div class="slider-cta"><a href="sell-to-us.php"><h3>Sell Us Your Equipment</h3><p>We buy a full range of tech equipment and we buy from Fortune 500 companies to small businesses.</p><p class="slider-button">Get a quote in 24 hours!</p></a></div></li>
            <li><div class="container"><div class="slider-cta"><a href="who-we-buy-from.php"><h3>Who We Buy From</h3><p>Whether you are a international corporation or small business, liquidating old tech equipment gives you capital to invest in your future.</p><p class="slider-button">Learn more here</p></a></div></div></li>
            <li><div class="container"><div class="slider-cta"><a href="data-destruction.php"><h3>Data Destruction</h3><p>We take the security of sensitive information very seriously. Tech Buyer is trusted by many organizations with their data.</p><p class="slider-button">Learn more here</p></a></div></div></li>
            <li><div class="container"><div class="slider-cta"><a href="community.php"><h3>Community</h3><p>We partner with and support non-profits to give back to our the community.</p><p class="slider-button"> See more here</p></a></div></div></li>
        </ul>

（我剥夺了很多美学和其他代码，因为它没有引起问题）

.slideshow li,
.slideshow {
position: absolute;
top: 0;
left: 0;
height: 30%;
width: 100%;
}

.slideshow {
overflow: hidden;
list-style: none;
color: white;
}
.slideshow li {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
opacity: 0;
filter: alpha(opacity=0);
-webkit-animation: images 6s linear 0s infinite;
        animation: images 6s linear 0s infinite;
overflow: hidden;
z-index: 0;
}

.slideshow li:nth-child(1) {
background-image: url("../img/what.png");
}

.slideshow li:nth-child(2) {
background-image: url("../img/hand-shake.png");
background-position: bottom;
-webkit-animation-delay: 6s;
        animation-delay: 6s;
}

有关更改此代码的任何建议，以便链接正常工作而无需完全重写代码？我完成了整个项目，现在它有这个错误。

链接css转换滑块中的故障

0 个答案: