如何讓我的J查詢滑塊工作？

我非常感謝任何幫助，使其工作。我已經嘗試了幾個這些JQuery滑塊教程，但我想我必須保持缺少一些至關重要的東西？如何讓我的J查詢滑塊工作？

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8" /> 
<title>ssss</title> 
<meta name="generator" content="BBEdit 10.5" /> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script src="responsiveslides.min.js"></script> 

<script> 
    $(function() { 
    $(".responsiveslides").responsiveSlides(); 
    }); 
</script> 

<script> 
$(".responsiveslides").responsiveSlides({ 
    auto: true,    // Boolean: Animate automatically, true or false 
    speed: 50,   // Integer: Speed of the transition, in milliseconds 
    timeout: 4000,   // Integer: Time between slide transitions, in milliseconds 
    pager: true,   // Boolean: Show pager, true or false 
    nav: true,    // Boolean: Show navigation, true or false 
    random: true,   // Boolean: Randomize the order of the slides, true or false 
    pause: true,   // Boolean: Pause on hover, true or false 
    pauseControls: true, // Boolean: Pause when hovering controls, true or false 
    prevText: "Previous", // String: Text for the "previous" button 
    nextText: "Next",  // String: Text for the "next" button 
    maxwidth: "",   // Integer: Max-width of the slideshow, in pixels 
    navContainer: "default",  // Selector: Where controls should be appended to, default is after the 'ul' 
    manualControls: "",  // Selector: Declare custom pager navigation 
    namespace: "rslides", // String: Change the default namespace used 
    before: function(){}, // Function: Before callback 
    after: function(){}  // Function: After callback 
}); 

</script> 
    <style> 

.responsiveslides { 
    position: relative; 
    list-style: none; 
    overflow: hidden; 
    width: 100%; 
    padding: 0; 
    margin: 0; 
    } 

.responsiveslides li { 
    -webkit-backface-visibility: hidden; 
    position: absolute; 
    display: none; 
    width: 100%; 
    left: 0; 
    top: 0; 
    } 

.responsiveslides li:first-child { 
    position: relative; 
    display: block; 
    float: left; 
    } 

.responsiveslides img { 
    display: block; 
    height: 60%; 
    float: left; 
    width: 69%; 
    border: 0; 
    } 
</style> 
</head> 
<body> 
<ul class="responsiveslides"> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%201.jpg" alt="101"/> </li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%202.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%203.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%204.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%205.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%206.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%207.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%208.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%209.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%2010.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%2011.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%2012.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%2013.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%2014.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%2015.jpg" alt="101"/></li> 
    <li><img src="/Users/mitchellheritagehaldenby/Desktop/outcast%20website/images/image%2016.jpg" alt="101"/></li> 
</ul> 

</body> 
</html>

來源

2014-02-28 user3192167

您是否確實下載了插件並將其放在服務器上的同一文件夾中作爲此頁？所有圖像的url是否正確？ –

你爲什麼初始化'responsiveSlides'兩次？ – Charlie

你好，謝謝你的答覆..我已經將滑塊文件添加到我的主文件夾中的js文件夾中，其中我的html準系統被保留。所有圖像的大小和功能完全相同，因爲我已經嘗試過使用它們無響應的舊查詢滑塊，它的工作原理。但不是我想要的滑塊。我下載的滑塊的鏈接是https://github.com/viljamis/ResponsiveSlides.js – user3192167

你不需要包含參數，除非你想改變默認值。這是我的。它是頁面上唯一的腳本

<script> 
    $(function() { 
    $(".rslides").responsiveSlides({ 
     nav:true, 
    }); 
    }); 
</script>

我想要做的就是顯示導航。其餘的保持默認。即時通訊使用jQuery 1.11.0

繼承人的我的頭

<script src="incls/jq1110.js"></script> 
<script src="incls/responsiveslides.min.js"></script>

鏈接到我的腳本也你說responsiveslides文件是在一個文件夾，名爲JS。從下面你腳本標籤看起來是從同一目錄調用它作爲你的網頁

<script src="responsiveslides.min.js"></script>

它應該是 <script src="js/responsiveslides.min.js"></script>？

歡呼聲

來源

2014-03-01 05:59:47

你傳說!!謝謝你朋友。 – user3192167

你知道我將如何去添加按鈕嗎？ – user3192167

它看起來像你正在初始化插件兩次。

首先在這裏，不帶選項...

$(function() { 
    $(".responsiveslides").responsiveSlides(); 
});

其次這裏與他們的整體轉換...

$(".responsiveslides").responsiveSlides({ 
    auto: true,    // Boolean: Animate automatically, true or false 
    speed: 50,    // Integer: Speed of the transition, in milliseconds 
    timeout: 4000,   // Integer: Time between slide transitions, in milliseconds 
    pager: true,    // Boolean: Show pager, true or false 
    nav: true,    // Boolean: Show navigation, true or false 
    random: true,   // Boolean: Randomize the order of the slides, true or false 
    pause: true,    // Boolean: Pause on hover, true or false 
    pauseControls: true,  // Boolean: Pause when hovering controls, true or false 
    prevText: "Previous", // String: Text for the "previous" button 
    nextText: "Next",  // String: Text for the "next" button 
    maxwidth: "",   // Integer: Max-width of the slideshow, in pixels 
    navContainer: "default", // Selector: Where controls should be appended to, default is after the 'ul' 
    manualControls: "",  // Selector: Declare custom pager navigation 
    namespace: "rslides", // String: Change the default namespace used 
    before: function() {}, // Function: Before callback 
    after: function() {}  // Function: After callback 
});

你只需要一次初始化插件。這裏是一個工作演示：http://jsfiddle.net/galengidman/JqU77/

來源

2014-03-01 00:20:40

嗨，我刪除了重複的代碼，但仍然無法正常工作？我不知道這是否應該有所作爲，但它不在服務器上，因爲我仍然在構建它，其次，如果下載的文件位於我的Barebones代碼的主文件內的單獨文件中，這是否重要？ – user3192167

如何讓我的J查詢滑塊工作？

回答

相關問題