0

jQueryで div を下にスクロールすると問題が発生します。

分割

HTML:

<div id="chatbox"></div>

CSS:

    #chatbox {
    width:300px;
    height:400px;
    background:grey;
    overflow-x:hidden;
    overflow-y:auto;
    border-radius: 10px;
    background: #045671;
}

onclick -> $("#chatbox").scrollTop(9999) を使用すると、スクロールが下に移動し、もう一度クリックするとスクロールが+20px上に移動します。

例 :http://46.238.10.232:10001/chat/

4

3 に答える 3

2

オーバーセットするscrollTopと、魔法が起こります(または、期待に応じて起こりません)。scrollTop9999に設定するとscrollTop、必要に応じて、0から9999までの任意の数値に設定されます。を読む こともできるscrollTopので、に設定しても、xそれが留まるという意味ではなくx、実際の位置になります。したがって、値のクエリに興味がある場合でも、それは理にかなっています。

要素の内容が変更された場合は、scrollTop再設定する必要があります。通常はtoscrollHeightで十分です(はい、完全に正確に計算することもできますがscrollTop、なぜ面倒なのですか?ブラウザーに計算を任せて、作業に戻ってください)。

つまり、「もう一度クリック」すると(それが何であれ)、チャットボックスにコンテンツが追加されていると思います。はい?次にscrollTopもう一度設定する必要があります。


毎回設定している場合は、おそらく早すぎます。単にイベントscrollTopに応答するのではなく、要素のコンテンツを変更した後に行う必要があります。onclick

于 2012-07-13T08:12:06.097 に答える
0

<a>タグがうまくいくかもしれません。私はそれがかなり醜いことを知っていますが、css を使用すると、通常のテキストとしてスタイルを設定したり、完全に非表示にしたりできます。

  1. スクロールしたい場所にカスタム要素を配置します。
  2. その id を (たとえば) に設定しscrollelementます。
  3. 「スクロール要素」に設定window.location.hashします。

Lee Kowalkowski のクレジット。

于 2012-07-13T08:13:40.713 に答える
0
$(document).scrollTop($("#chatbox").position.top+$("#chatbox").height());
于 2012-07-13T08:04:58.660 に答える