这http://unslider.com/由于某种原因没有出现在我的网站上,只有 li
文本显示并且它正在滑动但是没有 slider 的出现,只有文本。
我已经包含了 js
文件以及 css 和标记,但不知为何没有显示完整的 slider 。
这是我的代码:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Webpage</title>
<link rel = "stylesheet" type = "text/css" href = "1style.css"/>
<script src="//code.jquery.com/jquery-latest.min.js"></script>
<script src="//unslider.com/unslider.min.js"></script>
<script>
$(function() {
$('.banner').unslider();
});
</script>
</head>
<body>
<br/>
<h1 style="font-family:verdana; font-size:50px; font-weigth:bold; font-style:italic;" align="center" > Logo </h1>
<div class="banner">
<ul>
<li>This is a slide.</li>
<li>This is another slide.</li>
<li>This is a final slide.</li>
</ul>
</div>
<div id = "footer">
<div class = "container">
<ul>
<li><a href = "?">Terms of use</a></li>
<li><a href = "?">Privacy</a></li>
<li><a href = "?">Cookies</a></li>
<li><a href = "?">Accessibility</a></li>
</ul>
</div>
</div>
</body>
</html>
CSS:
.banner { position: relative; overflow: auto; }
.banner li { list-style: none; }
.banner ul li { float: left; }
有人可以检查我上面提供的链接并告诉我哪里出错了吗?
谢谢
似乎没有一个答案能解决问题,我想我必须找到一个新的 slider 。
感谢帮助
最佳答案
Unslider 从列表 ( <li>
) 的第一个列表项 ( <ul>
) 中选择高度。因此,要使其完美运行,只需将高度添加到第一个元素即可。
关于javascript - Unslider 无法在网站上运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17382355/