3

WordPress の投稿に jQuery Isotope プラグインを使用しています。ページの読み込み時に投稿の抜粋のみを表示し、div の高さを拡大するだけでクリック時に投稿全体を表示したいと考えています。ただし、Isotope プラグインは、ユーザーが [Read More] ボタンをクリックしてページを展開する前に div の高さを計算するため、新しい高さによってプラグインが壊れます。

私は reLayout メソッドをいじっていますが、それを理解していません...何かアイデアはありますか?

ここに作業リンクがあります。「いちご」の投稿をお試しください。http://ashlinixon.com/new-test/index.html

また、コード サンプル:

HTML:

<article class="item">
    <div class="featured-img"><img src="images/strawberries.jpg" alt="Strawberries" /></div>
    <h2>Strawberries</h2>
    <p class="excerpt">Lorem ipsum dolor sit amet</p>
    <p class="read-more">Read more</p>
    <div class="post">
        test test<br />test test<br />test test
    </div>
</article>

jQuery:

$(document).ready(function(){
    $(".post").hide();
    $(".excerpt").show();

    $('.read-more').click(function(){
        $(".post").slideToggle();
        $("#portfolio").isotope( 'reLayout' );
    });            
});

ありがとう！:)

4

1 に答える 1

6

slideToggle の代わりにトグルを使用すると、うまく動作するようです。今の私には十分です。:)

$(document).ready(function(){
  $(".post").hide();
  $(".excerpt").show();

  $('.read-more').click(function(){
      $(".post").toggle();
      $("#portfolio").isotope( 'reLayout' );
  });              
});
于 2012-06-30T02:31:40.350 に答える