いくつかのスライドを含むスライダーがあります。すべてのスライドの高さが異なります。
次のように動作します。
1枚目のスライド
<holder>
<slide - display: block>
<slide - display: none>
<slide - display: none>
</holder>
2枚目のスライド
<holder>
<slide - display: none>
<slide - display: block>
<slide - display: none>
</holder>
等
スライドにはposition: absolute
(こうでなければならない)があります。
問題は次のとおりです。高さを動的に変更しholder
て、すべてのスライドのコンテンツ全体を表示する方法は?
今私が持っています:
<script type="text/javascript">
$(document).ready(function(){
$(".holder").height( $(".slide").height() );
});
</script>
<script type="text/javascript">
$(window).resize(function() {
$(".holder").height( $(".slide").height() );
});
</script>
ただし、最初のスライドの高さのみを使用するため、他のスライドは切り取られます。
この問題を解決するには、javascript を使用してください。