2

back-to-top画面の左側にボタンが付いています。ボタンをscrollTopクリックすると、ページの上部にスライドスクロールするために使用されます。ページが読み込まれると、ボタンが表示され、読み取り可能なものなどはカバーされません。

ユーザーがページを下にスクロールすると、ボタンはテキストコンテンツを含む特定のDIVに移動します。ボタンがそのようなDIVに入るとき、私はそれを使用して非表示にしたいです.hide()。それを動作させることができません、これが私が持っているものです：

    var p = $('a.back-to-top');
    var position = p.position();

    if(position == $('#about-me')){
        $('a.back-to-top').hide();
    }

if(position == $('#about-me'))ボタンの位置が#about-meDIV内にあるかどうかを確認する正しい方法はありますか？positionまたは、 DIVの場合と同様の変数を作成する必要がありますか？

編集：厄介だが単純なフィドル

4

2 に答える 2

3

http://api.jquery.com/position/ --position（）メソッドは、.leftプロパティと.topプロパティを持つpositionオブジェクトを返します。したがって、基本的に、セレクターによって返されるオブジェクトと位置を比較することはできません。代わりに、両方の要素の「上位」プロパティ値を比較する必要があります。たとえば、次のようになります。

var p = $('a.back-to-top');
var position = p.position();

また、これを入手してください：

var aboutMePosition = $('#about-me').position();

そして、あなたは比較することができます：

aboutMePosition.topとposition.topのどちらかが必要です。

于 2012-12-01T16:17:54.480 に答える
3

コールバック内でこのチェックを行う必要があります。おそらく$(window).scroll、ウィンドウがスクロールするたびにチェックされるようにするためです。それ以外の場合は、ページが読み込まれたときにのみチェックされます。

position親に対する相対的な位置なので、どちらも使いたくないと思います。代わりに、おそらく必要です.offset。topこれにより、とleftメンバーを持つオブジェクトが返されます。特にjQueryオブジェクトの==場合、比較は意味がありません。使用したい：

$(window).on('scroll', function () {
   var offset = $("a.back-to-top").offset().top;

   var within = $("#about-me").offset().top;

   if (offset >= within && offset <= within + $("#about-me").height()) {
      $("a.back-to-top").hide();
   }
   else {
      $("a.back-to-top").show();
   }
});​

位置が固定されている場合、スクロールによってオフセットが.back-to-top変化しますが、静的ブロックのオフセットは変化しないため、この比較を行うことができます。

実際の動作をご覧ください：http：//jsfiddle.net/QnhgF/

于 2012-12-01T16:19:32.170 に答える