質問編集履歴

1

質問内容がわかりにくかったため

2018/04/16 02:47

投稿

ma.sa
ma.sa

スコア11

test CHANGED
@@ -1 +1 @@
1
- magnific popupで横のみ画面サイズに合わせいです。(縦長の画像はみ出してスクロール確認したい
1
+ magnific popupたはcolorbox.jp背景を固定したい
test CHANGED
@@ -2,64 +2,36 @@
2
2
 
3
3
 
4
4
 
5
- レスポンシブ対応のポップアップ機能実装したいと思いmagnific popup設置しました。
5
+ (以前違う質問をしたのですが、内容がわかりににくく、回答が得られませんでしたので、質問内容変更しました。申し訳ございません。)
6
-
7
- 動かすことはできたのですが、縦長の画像の表示が小さくなるので、
8
-
9
- 横幅のみ伸縮して、高さは画面からはみ出してもよいので、
10
-
11
- 下の方はスクロールで見れたらよいなと思いました、が、
12
-
13
- カスタマイズの方法がよくわかりませんでした。
14
6
 
15
7
 
16
8
 
17
- magnific popupのカスタマイズ方法アドバイスしていただければと存じます。
9
+ レスポンシブ対応のポップアップ機能を実装したいと思いmagnific popupかcolorbox.js検討しています。
18
10
 
19
11
 
20
12
 
21
- もしくは、違うプラグインでよいものがありましたらご紹介いただければ嬉しいです。
22
-
23
- どうぞよろくお願いたします。
13
+ 表示主な内容は、外部HTMLです。
24
14
 
25
15
 
26
16
 
27
-
28
-
29
- ### 試したこと
17
+ どちらのプラグインも設置まではできましたが、同じ問題でつまずいています。
30
18
 
31
19
 
32
20
 
33
- cssを確認てみましたが、該当箇所がよくわかりせんした
21
+ それはポップアップしたときに、背景固定されずスクロールしてしうこと
34
22
 
23
+ 背景がスクロールしてしまうことでポップアップも一緒に動いてしまうので、
24
+
35
- この辺りはなかと予想はしたですが・・・
25
+ きれば、ポップアップしてる間背景を固定したです
36
26
 
37
27
 
38
28
 
39
- ```css
40
-
41
- img.mfp-img {
42
-
43
- width: auto;
44
-
45
- max-width: 100%;
46
-
47
- display: block;
48
-
49
- height: auto;
50
-
51
- line-height: 0;
52
-
53
- -webkit-box-sizing: border-box;
29
+ スマホ(iphone/android)でも同様に固定できればと思っています。
54
-
55
- -moz-box-sizing: border-box;
56
-
57
- box-sizing: border-box;
58
-
59
- padding: 40px 0 40px;
60
-
61
- margin: 0 auto; }
62
30
 
63
31
 
64
32
 
33
+ magnific popupかcolorbox.jpで、実現可能な方を採用して制作を進めていきたいと思いますが、他のプラグインなどございましたらご提案いただけたらと思います。
34
+
35
+
36
+
65
- ```
37
+ ぜひアドバイスよろしくお願い致します。