gpt4 book ai didi

javascript - flexslider css 导致图像消失

转载 作者:行者123 更新时间:2023-11-28 06:16:14 24 4
gpt4 key购买 nike

我一直在尝试使用 flexslider 添加到我的网站,但最初在实现这些功能时遇到了麻烦。检查演示代码后,我决定将他们提供的示例代码复制到我自己的 html 中以查看结果。按照网站的教程

<link rel="stylesheet" href="flexslider.css" type="text/css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="jquery.flexslider.js"></script>

然后我复制了演示文件的图像

        <div class="flexslider">
<ul class="slides">
<li>
<img src="images/kitchen_adventurer_cheesecake_brownie.jpg" />
</li>
<li>
<img src="images/kitchen_adventurer_lemon.jpg" />
</li>
<li>
<img src="images/kitchen_adventurer_donut.jpg" />
</li>
<li>
<img src="images/kitchen_adventurer_caramel.jpg" />
</li>
</ul>
</div>

复制他们拥有的 slider ,但是这些图像根本不显示。一旦CSS文件

<link rel="stylesheet" href="flexslider.css" type="text/css">

被删除,它再次出现。有谁知道为什么图像似乎消失了,或者我如何才能将其正确格式化为 flexslider 演示。

最佳答案

Flexslider 隐藏幻灯片,直到它被初始化以防止 FOUS .

您可以在此处看到以下 css:https://github.com/woothemes/FlexSlider/blob/master/css/base.less

.slides {
> li {
display: none;
-webkit-backface-visibility: hidden;
}
}

关于javascript - flexslider css 导致图像消失,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35876649/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com