2013-08-14 29 views
10

Tôi đã sử dụng plugin jQuery Cycle vì tôi thích cách dễ dàng tùy chỉnh, chẳng hạn như chèn các phần tử HTML tùy chỉnh mà tôi chọn và chỉ định chức năng nút 'tiếp theo' hoặc 'trước'.Tùy chọn Flexslider Next/Previous Buttons

Tôi không thể tìm thấy cách để thực hiện điều này trong Flexslider, tuy nhiên, tôi chỉ thấy tùy chọn cho phân trang tùy chỉnh. Ví dụ. manualControls.

Có ai biết cách thực hiện điều này trong Flexslider không? Ví dụ. thiết lập một hình ảnh hoặc neo như là một nút 'tiếp theo'.

Trả lời

27

Làm thế nào về một cái gì đó như thế này:

$('.slider').flexslider({ 
    directionNav: false, 
    controlNav: false 
}) 

$('.prev').on('click', function(){ 
    $('.slider').flexslider('prev'); 
    return false; 
}) 

$('.next').on('click', function(){ 
    $('.slider').flexslider('next'); 
    return false; 
}) 

Demo

Hoặc nếu bạn không wan't để viết nó 2 lần, bạn có thể làm điều này quá:

$('.slider').flexslider({ 
    directionNav: false, 
    controlNav: false 
}) 

$('.prev, .next').on('click', function(){ 
    var href = $(this).attr('href'); 
    $('.slider').flexslider(href); 
    return false; 
})  

Demo v2

+0

làm việc như một sự quyến rũ, cảm ơn bạn! – pealo86

Các vấn đề liên quan