質問編集履歴
1
初期表示位置の設定がうまく行きません。
title
CHANGED
File without changes
|
body
CHANGED
@@ -1,8 +1,7 @@
|
|
1
1
|
### 前提・実現したいこと
|
2
2
|
ホームページにcssとjqueryで遅れて追従する固定ボタンを設置したいです。
|
3
|
-
下記のソースで表示させて動くところまでは持ってきたのですが、
|
4
|
-
ウインドウの
|
3
|
+
場所はウインドウの下に固定したいです。
|
5
|
-
スク
|
4
|
+
スクロールすると下付になるのですが、初期表示が上にくっついたままです。
|
6
5
|
|
7
6
|
### 該当のソースコード
|
8
7
|
<style>
|
@@ -15,24 +14,25 @@
|
|
15
14
|
|
16
15
|
<script>
|
17
16
|
$(window).load(function() {
|
18
|
-
|
17
|
+
var windowH = window.innerHeight;
|
18
|
+
var startPosition = windowH - 30 + "px";
|
19
|
+
$(".Btn").offset({ top : startPosition})
|
20
|
+
|
19
|
-
|
21
|
+
var initPosition = $(".Btn").offset().top;
|
20
22
|
$(window).scroll(function() {
|
21
23
|
var scroll = $(document).scrollTop();
|
24
|
+
|
22
25
|
// 移動後ポジション
|
23
|
-
var movePosition = initPosition + scroll +
|
26
|
+
var movePosition = initPosition + scroll + windowH - 30 + "px";
|
24
|
-
$(".
|
27
|
+
$(".dsbBtn").animate({ top : movePosition},
|
25
|
-
top : movePosition
|
26
|
-
}, {
|
27
|
-
|
28
|
+
{ duration : 600, queue : false});
|
28
|
-
queue : false
|
29
|
-
});
|
30
29
|
|
31
30
|
});
|
32
31
|
});
|
33
32
|
</script>
|
34
33
|
|
34
|
+
|
35
|
+
|
35
36
|
### 試したこと
|
36
|
-
|
37
|
-
cssでは無理っぽいのでjsのwindow.innerHeightでどうにかするのではないかと思い
|
38
|
-
見よう見まねで
|
37
|
+
見よう見まねで移動後のポジションは下付にすることができました。
|
38
|
+
初期位置もoffsetを使って初期位置を設定して見たのですがうまく行きませんでした。
|