2013-05-04 82 views
2

我想知道是否有一種簡單的方法來控制圖像幻燈片,我已經與UI滑塊小工具一起使用jQuery Cycle。用jQuery UI滑塊小部件控制jQuery Cycle?

循環代碼:

$(window).load(function(){ 
    $('.foo').cycle({ 
     timeout : 80, 
     speed : 80 , 
     startingSlide : 0, 

    }); 

}); 

和小部件是這樣的:

$(function() { 
    $("#slider-vertical").slider({ 
    orientation: "vertical", 
    range: "min", 
    min: 0, 
    max: 300, 
    value: 300, 
    slide: function(event, ui) { 
     $("#amount").val(ui.value); 
     console.log(ui.value); 
    } 
    }); 
    $("#amount").val($("#slider-vertical").slider("value")); 
}); 

上週期選項可能由UI部件被吐出的值進行操作的任何想法?謝謝!

+0

我不確定問題到底是什麼,因爲「操縱」是非常開放的。你想要達到什麼目的?附註:這裏的尾部逗號'startingSlide:0,'可以打破某些瀏覽器。 – Ohgodwhy 2013-05-04 23:47:32

回答

0

對不起,像往常一樣,我發佈後立即解決。

jQuery的循環碼保持不變:

$(window).load(function(){ 
    $('.foo').cycle({ 
     timeout : 80, 
     speed : 80 , 
     startingSlide : 0, 
    }); 
}); 

我改變UI部件代碼(見最後一行),爲這樣的,其中I簡單地傳遞插件值插入週期。該值本質上設置了活動幻燈片。

$(function() { 
    $("#slider-vertical").slider({ 
    orientation: "vertical", 
    range: "min", 
    min: 0, 
    max: 300, 
    value: 300, 
    slide: function(event, ui) { 
     $(".foo").cycle(ui.value); 
    } 
    });  
});