自動的にサイズ変更されるJavaScriptスライダ

Question

私は最後の4つの投稿を表示するクライアント用のコンテンツスライダを作成しようとしています。今は単なるHTMLですが、問題があります。

必要に応じて、スクロールバーを使用してスライダボックスの高さを180pxにする必要があります。私のスライダーは、スライドボックスを一番大きなボックスと同じ高さにする以外は、動作するようです。それはそれらの下に空白のトンの短い記事を残す。

誰かが修正を知っていますか？

http://jsfiddle.net/insitedesignlab/kQDcb/1/

私はQuovolverがこれを行うことを見てきましたが、私は基本的な問題が#slidesContainerが動的にそれがどのくらい知っている親のためにサイズを変更する必要があるか

Answer 1

知ってみたいですスクロールするこの問題を解決する1つの方法は、コールバックを含めるようにアニメーションのコールを変更することです：

$('#slideInner').animate({ 
     'marginLeft' : slideWidth*(-currentPosition) 
    },null,null, 
    function(){ 
     $('#slidesContainer').css('height', $(this).children(".slide:nth-child(" + parseInt((Math.ceil(-1*slideWidth*(-currentPosition)/$("#slideshow").width())) + 1) + ")").height() + "px"); 
    } 
); 

は、その計算を行うために、わずかに良い方法はおそらくありますが、これは動作します。代わりに、表示されていない他の.slide divをすべて非表示にすることもできます。次に、#slidesContainerは、表示（表示なし：なし）スライドのみに自動的にリサイズされます。

Answer 2

ここでコードを更新しましたJS Fiddle min-heightプロパティを削除し、背景色をスライドdivに設定する必要があります。