2

私のポートフォリオはhttp://www.visualise.ca/にあり、現在アイソトープを実行する新しいバージョンに取り組んでいます。http://themes.visualise.ca/visualiseで入手できます。

ページ内の投稿をロードする画像のサムネイルをクリックすると、jQuery scrollTo プラグインと次のコードを使用して、ページをアイテム (クリックされた画像のサムネイル) までスクロールしたいと思います。

$container.delegate( $itemString, 'click', function(){
        $(this).toggleClass('large');
        $container.isotope('reLayout');
        $('html,body').scrollTo(this, 800);
});

しかし、テスト後、アイテムの位置は常にコンテナの上:1 左:1 のように見えます (アイテムに 1px の境界線がない場合、これは 0 になります)。また、Firebug を使用してアイテムを検査すると、強調表示された青い線はアイテム自体ではなく、コンテナーの上部:1 左:1 にあります。

したがって、同位体のために、すべてのプラグインがすべての項目が 0,0 (私の場合は余白のため 1,1) にあると考えるようになったのではないかと思います。

正しくスクロールするにはどうすればよいですか?

お時間を割いてご協力いただき、誠にありがとうございました。

4

2 に答える 2

6

次の手法を使用して、コンテナに対するアイテムの適切な位置を取得できます。itemPositionDataEnabled: trueオプションで設定し、 を使用して位置を取得します.data('isotope-item-position')。あなたのコードのために

$container.isotope({
  // options...
  itemPositionDataEnabled: true
});

$container.delegate( $itemString, 'click', function(){
  var $this = $(this),
      itemPosition = $this.data('isotope-item-position');
  $this.toggleClass('large');
  $container.isotope('reLayout');
  $('html,body').scrollTo( itemPosition.y, 800);
});
于 2011-11-03T17:47:38.327 に答える
0

itemPositionDataEnabled Isotope の v2 で削除され、上記の回答は機能しなくなります。

この回答positionは、 orを使用して基本的な jQuery で同じ結果を得るのに役立ちますoffset

于 2015-02-20T00:50:46.700 に答える