0

コミュニティ サイトの広告をめくるために使用する簡単なスライドショーがあります。私はjqueryが初めてなので、jqueryが次にプルする子divに基づいて親divの高さを変更する方法がわかりません。私のコードについては、以下のjsfiddleを参照してください。

HTML:

<div class="slideshow" id="ads_slideshow">
  <div id="slide1" class="slide">
    <p>Test Advertisement</p>
    <p>Just testing advertisements</p>
  </div>
  <div id="slide2" class="slide">
    <p>Test Ad 3</p>
    <p>One more test ad, just for clarity.</p>
  </div>
</div>

CSS:

.slideshow{ position: relative; border: 1px solid #000; }
#slide1, #slide2{ position: absolute; }

Jクエリ:

$(function () {
    $('.slideshow div').hide();
    $('.slideshow div:first-child').show();
    setInterval(function () {
        $('.slideshow div:first-child').fadeOut(500)
            .next('div').fadeIn(500)
            .end().appendTo('.slideshow');
    },
    2000);
});

Jsfiddle: http://jsfiddle.net/us3m9/4/

4

2 に答える 2