2016-08-03 8 views
-4

私は多くを探していますが、正しく名前を付ける方法はわかりません。divの最後に固定要素

アイデア:

私たちには2つのdivがあります。左の最初のものは、右のものより多くの内容を持っています。第2のものには、記入して送るだけの形式しかありません。ユーザーが左のdivをスクロールして詳細を表示すると、連絡先フォームの右側がこのdivの最後まで続きます。また、ユーザーがスクロールすると、このフォームが右側に表示されます。

どのように検出するのですか?フレームワークはありますか?

私はウェブサイトに多くのdivがあり、それぞれにこのスクリプトが必要です。ページへ

SCREEN

リンク:

LINK

+0

私が正しく理解していれば、問題は右の「div」がスクロールすることです。もしそうなら、 'position:fixed'を試してください。そして、**あなたのコードを追加するか、さらには、[jsbin](http://jsbin.com)または何かを使ってリンクにポストデモを投稿してください。 –

+0

@MoshFeuまったくいいえ、右のdivはスクロールせず、私はそれを強制したい。私はポジションで試しました。問題のこのページへのリンクを追加します – kjugi

答えて

0
+0

はい、この最初のリンクのようなもの!それは私が探しているものです、ありがとうございます:) – kjugi

+0

2番目のdivのCSSプロパティーを設定する必要があります。 '' fixed: ''と他のユーザーが既に提案しています。これを達成する方法がわからない場合は、私が提供したリンクからサンプルをダウンロードして助けてください。 –

+0

要件に合っている場合は、それをあなたの答えとしてください。私はそれが適切な解決策ではないことを知っていますが、同じ/類似のものを探している他の人を助けるかもしれません。 –

0

あなたは右側のためのCSS position: fixed;を使用することができます。

+0

結果は期待通りですか? http://codepen.io/tunguyen/pen/JKamNN。 – kate

+0

何かsimillarがありがとう:) – kjugi

0

これはあなたが欲しいものです。コンセプトはあなたのCSSにposition:fixedright:0および/またはtop:10pxのプロパティを使用することです。これはそのための小さな例です。これが役に立ちます。

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
\t <title></title> 
 
</head> 
 

 
<style type="text/css"> 
 
\t body{ 
 
\t \t width: 100%; 
 
\t \t height: 1000px; 
 
\t \t background-color: orange; 
 
\t } 
 

 
.right{ 
 
\t width: 30%; 
 
\t position: fixed; 
 
\t right: 0; 
 
\t height: 500px; 
 
\t background-color: gray; 
 
} 
 

 
.check{ 
 
\t position: absolute; 
 
\t top: 900px; 
 

 
} 
 
</style> 
 

 
<body> 
 

 
<div class="right"> 
 
\t <h2>send an email</h2> 
 
</div> 
 

 
<h1 class="check">checkin the view</h1> 
 
</body> 
 
</html>

値は、アイデアを得るあなたの必要性として、それらを変更することがあります。

+0

cool and thanks :) – kjugi

関連する問題