回答編集履歴
2
追記
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
|
-
|
|
51
|
+
}
|
|
50
|
-
|
|
51
|
-
|
|
52
52
|
|
|
53
53
|
```
|
|
54
54
|
|
|
@@ -56,11 +56,15 @@
|
|
|
56
56
|
|
|
57
57
|
```JS
|
|
58
58
|
|
|
59
|
-
|
|
59
|
+
window.onresize = function(){
|
|
60
60
|
|
|
61
|
-
var
|
|
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
追記
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)
|