回答編集履歴

1

iframe内部に背景画像を設置する方法を追記

2018/11/04 02:14

投稿

kaba
kaba

スコア314

test CHANGED
@@ -35,3 +35,41 @@
35
35
  ```
36
36
 
37
37
  これで背景位置が固定されるはずです。
38
+
39
+
40
+
41
+ 追記
42
+
43
+ iphone向けの有効な対策としては、position:fixedを使用しないことです。
44
+
45
+ position:fixedを使用せずに位置を固定するにはスクロール領域自体に背景を設定すればいいので、
46
+
47
+ スクロール領域をiframe内のbodyに移し、
48
+
49
+ スクロール領域(=body)に背景画像を設定します。
50
+
51
+ iframe埋め込み側
52
+
53
+ ```css
54
+
55
+ html {
56
+
57
+ overflow: hidden;
58
+
59
+ }
60
+
61
+ body {
62
+
63
+ background-color: transparent;
64
+
65
+ background-image: url(photo.jpg);
66
+
67
+ background-size: cover;
68
+
69
+ background-position: top center;
70
+
71
+ overflow: scroll;
72
+
73
+ }
74
+
75
+ ```