0

我一直在尝试在我自己的项目中使用 unslider (jQuery)。尽管按照https://idiot.github.io/unslider/网站上的说明进行操作,但我似乎无法正常工作。

有人愿意看看我的代码并就这里可能出现的问题提供一些反馈吗?

谢谢!

--

<!doctype html>
<html>

<head>
<title>Testing unslider</title>

<meta charset="utf-8" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />

<link rel="stylesheet" href="/unslider-master/dist/css/unslider.css">
<link rel="stylesheet" href="/unslider-master/dist/css/unslider-dots.css">

</head>

<body>

<div class="my-slider">
    <ul>
        <li>My slide</li>
        <li>Another slide</li>
        <li>My last slide</li>
    </ul>
</div>

<script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="/unslider-master/src/js/unslider.js"></script>

<script>
    jQuery(document).ready(function($) {
        $('.my-slider').unslider();
    });
</script>

</body>

</html>
4

1 回答 1

0

我假设您在本地运行此程序(您不是通过 Web 服务器提供此服务)。如果是这种情况,您需要解决以下问题:

首先,您需要去掉 unslider 资产 URL 中的正斜杠。使用正斜杠意味着浏览器将查找相对于 URL 根目录的文件,这不是您想要的。相反,您希望浏览器在当前目录中查找文件。

其次,使用httpsjQuery 资产 URL 中的协议直接从 Web 获取它。\\很有用,因为它允许 URL 在从可能使用也可能不使用的服务器发出请求时独立于协议https。但是,当您从文件系统中获取文件时,您最终会得到一个类似的 URL file://code.jquery.com/jquery-2.1.4.min.js,因为 jQuery 不在您的计算机上,所以该 URL 会失败。

这是一个工作版本:

<!doctype html>
<html>
    <head>
        <title>Testing unslider</title>
        <meta charset="utf-8" />
        <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="stylesheet" href="unslider-master/dist/css/unslider.css">
        <link rel="stylesheet" href="unslider-master/dist/css/unslider-dots.css">
    </head>
    <body>
    <div class="my-slider">
        <ul>
            <li>My slide</li>
            <li>Another slide</li>
            <li>My last slide</li>
        </ul>
    </div>
    <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
    <script src="unslider-master/src/js/unslider.js"></script>
    <script>
        jQuery(document).ready(function($) {
            $('.my-slider').unslider();
        });
    </script>
    </body>
</html>
于 2016-02-25T02:35:09.423 回答