2012-01-21 15 views
2

私には400pxの高さのdivがあり、その中にスクロールする内容があります。私は内部に画像を持つ別のdivを持っていますが、このdivはposition:absoluteを使ってこの親divの一番下に座っています。下:0;しかし、スクロールすると、親divの内容が上に移動します。divをスクロールする別のdivの一番下に置く方法

ユーザーが親divをスクロールするたびにdivの位置を下に変更するためにjQueryを使用しましたが、これは動作しますが、divがスクロールするたびにジャンプします。

円滑なスクロールでこれを行う方法はありますか?親divの一番下に座って移動しないようにしたいと思います。

ありがとうございました

答えて

6

他のdivの中にコンテンツを含むdivを配置し、親を基準に画像を配置できます。スクロールバーの高さを考慮する必要がありますが、それ以外の場合は機能するはずです。私はあなたのためにjsfiddleを考え出すつもりです。

http://jsfiddle.net/AwH9S/

あなたは、スクロールバーのサイズと、それは存在だかどうかを決定するために、いくつかのJavaScriptを実装したい場合があります。

+0

これは完全に機能しました。スクロールが一番下になったときに画像を隠すためにif(elem [0] .scrollHeight - elem.scrollTop()== elem.outerHeight()){//画像の機能を隠す}を使用しました。ありがとう –

0

いくつかのHTML/CSSを共有できますか?あなたのCSS

#theDiv { 
    position: absolute; 
    bottom: 0; 
} 

で、その上に

は、親はそれが

position: relative; 
0

あなたは、このようにやろうとしているものを行うことはできません与えるのです。以前の位置相対および絶対位置の提案は、親divの一番下にあるimgを "初期化"するのに役立ちますが、もし "scrollHeight"(もし私が間違っていれば正解、ここで正しいvocab )が変更されると、ユーザがdivをスクロールすると、絶対的に配置されたdivはそのような絶対位置を保持し、コンテンツと一緒にスクロールします。 固定位置は、親の親戚ではなく画面に固定されるため、使用できません。これを行う最も簡単な方法は、2つのdivを含むparerntを設定することです.1つはスクロール可能なコンテンツ用、1つは画像用、もう1つは第2回目は「第1回目の底に付く」と表示されます。

関連する問題