2

Web アプリにチャット システムを実装しており、メッセージ リスト (新しいメッセージが下に追加される場所) と、ユーザーがメッセージを入力できるメッセージ ボックスを表示しています。

ここに画像の説明を入力

私が直面している現在の問題は、リストに新しいメッセージを追加すると、メッセージ ボックスが画面の下に押し出されることです (最後の行の一番下に追加されます)。

画面上のメッセージ ボックスが押し下げられないように、その位置を固定するにはどうすればよいですか?

明確にするために、メッセージ ボックスは常にリストの最後のメッセージの下にあります。これは、メッセージボックスが常に所定の位置、つまり画面の中央に留まるように、ページを自動スクロールする必要があることを意味します

4

2 に答える 2

0

正確な質問を完全に理解することはできません。

他のコントロールの位置に関係なく、ウィンドウ内の特定の位置にメッセージボックスを固定しようとしている場合は、次のようにすることができます。

#msgboxContainer
{
  position:absolute;
  left:10px; 
  bottom:20;
}
于 2012-10-06T06:26:49.040 に答える
0

マークアップを共有していないので、私のデモを 1 つ作成しました...入力ボックスの押し下げを停止するには、メッセージ ボックスで を使用して、次のように高さを固定する必要がありますoverflow-y: scroll;。フィドル

HTML

<div class="container">
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
blah<br>
</div>
<input type="text" />​

CSS

.container {
height: 200px; 
width: 200px; 
background-color: #ff0000; 
overflow-y: scroll;
}​
于 2012-10-06T04:49:41.680 に答える