teratail
回答率
85.47%
質問するログイン新規登録
トップCSS3に関する質問親要素の右下にfixedで要素を固定したい

編集履歴

回答編集履歴

2

追記

2019/12/01 03:33

投稿

kyoya0819
kyoya0819

スコア10429

test CHANGED
@@ -44,11 +44,11 @@
44
44
 
45
45
  ```JS
46
46
 
47
+ window.onresize = function(){
47
48
 
49
+ document.getElementById('with').style.right = window.pageXOffset + document.getElementsByTagName('main')[0].getBoundingClientRect().left + 'px';
48
50
 
49
- document.getElementById('with').style.right = window.pageXOffset + document.getElementsByTagName('main')[0].getBoundingClientRect().left + 'px';
51
+ }
50
-
51
-
52
52
 
53
53
  ```
54
54
 
@@ -56,11 +56,15 @@
56
56
 
57
57
  ```JS
58
58
 
59
- var target = document.getElementById('with');
59
+ window.onresize = function(){
60
60
 
61
- var parent = document.getElementsByTagName('main')
61
+ var target = document.getElementById('with');
62
62
 
63
+ var parent = document.getElementsByTagName('main')
64
+
63
- target.style.right = window.pageXOffset + parent[0].getBoundingClientRect().left + 'px';
65
+ target.style.right = window.pageXOffset + parent[0].getBoundingClientRect().left + 'px';
66
+
67
+ }
64
68
 
65
69
 
66
70
 

1

追記

2019/12/01 03:33

投稿

kyoya0819
kyoya0819

スコア10429

test CHANGED
@@ -52,6 +52,20 @@
52
52
 
53
53
  ```
54
54
 
55
+ わかりやすくすると以下の通りになります。
56
+
57
+ ```JS
58
+
59
+ var target = document.getElementById('with');
60
+
61
+ var parent = document.getElementsByTagName('main')
62
+
63
+ target.style.right = window.pageXOffset + parent[0].getBoundingClientRect().left + 'px';
64
+
65
+
66
+
67
+ ```
68
+
55
69
 
56
70
 
57
71
  [サンプル](https://cdpn.io/asuchi0819/debug/qBBewqW/gakeYzdmREVk)