jQuery Cycle Plugin - Tự động chiều cao cho container

Question

Tôi đang sử dụng trên một số cycle plugin divs, như thế này:

<div class="sections"> 
    <div class="Section"> <img /> text </div> 
    <div class="Section"> <img /> text </div> 
    <div class="Section"> <img /> text </div> 
</div> 

tất cả các divs .section có chiều cao thay đổi, dựa trên nội dung của họ. Làm thế nào tôi có thể làm cho chu kỳ không thay đổi kích thước div container (phần) thành chiều cao con lớn nhất? Thay vào đó, tôi muốn vùng chứa thay đổi kích thước trên mọi hình động theo chiều cao con hiện tại.

Answer 1

đặt containerResize tùy chọn 0 và thử. Chi tiết tùy chọn khác here.

Answer 2

ok, tôi cố gắng làm điều đó bằng cách gắn một hàm trên 'sau khi' sự kiện:

function onAfter(curr, next, opts, fwd) { 
    var $ht = $(this).height(); 

    //set the container's height to that of the current slide 
    $(this).parent().animate({height: $ht}); 
} 

tìm thấy thông tin ở đây: http://forum.jquery.com/topic/jquery-cycle-auto-height

Answer 3

tôi đã thực hiện nó một chút khác nhau:

$('.cycle-list').cycle({ 
    containerResize: 0, 
    before: function(currSlideElement, nextSlideElement, options, forwardFlag) { 
     var container = $(this).parent(); 
     container.css('height', Math.max(container.height(), $(nextSlideElement).height())); 
    }, 
    after: function(currSlideElement, nextSlideElement, options, forwardFlag) { 
     $(this).parent().css('height', $(this).height()); 
    } 
    }); 

Các mục của tôi cũng có chiều cao khác nhau. Trước đây, nó đảm bảo rằng thùng chứa đủ lớn cho lớn hơn 2 trang trình bày. Trong phần sau, nó chỉ thay đổi kích thước cho trang trình bày tiếp theo. Bằng cách này, nó không bao giờ quá dòng vì vùng chứa của bạn quá nhỏ.

lưu ý: đây là dành cho chu kỳ 1