如何在網站上使用unslider？

我一直在嘗試在我自己的項目上使用unslider（jQuery）。儘管遵循了https://idiot.github.io/unslider/網站上的說明，但我似乎無法讓事情順利進行。如何在網站上使用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>

來源

2016-02-25 m.i.k

打開開發者控制檯。你看到什麼錯誤？所有的文件（CSS，JavaScript）都被加載了嗎？ – linstantnoodles

我假設你在本地運行這個（你不通過Web服務器提供服務這一點）。如果是這樣的話，這裏是你需要修復的東西：

首先，你需要擺脫你的unslider資產URL的正斜槓。使用正斜槓意味着瀏覽器將查找相對於URL根目錄的文件，這不是您想要的。相反，您希望瀏覽器在當前目錄中查找文件。

其次，使用https作爲jQuery資產URL中的協議，以直接從網頁獲取它。 \\非常有用，因爲它可以在從可能使用或不使用https的服務器發出請求時允許URL與協議無關。但是，當您從文件系統獲取文件時，最終會得到一個類似file://code.jquery.com/jquery-2.1.4.min.js的URL，因爲jQuery不在您的計算機上，所以這會失敗。

這裏有一個工作版本：

<!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-25 02:35:09 linstantnoodles

如何在網站上使用unslider？

回答

相關問題