Web Dragon

【jQuery】モーダルウィンドウ表示時に背景が表示されない(fancybox)

iPhone、iPadでモーダルウィンドウ表示時に黒背景が表示されない事態発生!!
色々と調べてみたところ、jquery.fancybox.cssを編集すれば直ることがわかったのでメモ!


.fancybox-overlay {
	position: relative;/*absoluteからrelativeに変更*/
	top: 0;
	left: 0;
	overflow: hidden;
	display: none;
	z-index: 8010;
	background: url('fancybox_overlay.png');
}

参考サイトではz-indexをコメントアウトにしておりましたが、私の場合はそれだと黒背景は表示されましたが、モーダルウィンドウがどっかにいってしまいました。

またこの方法で直らなかった方はbackgroundの画像パスを確認してみてください。



【参考サイト】Fancybox overlay issue on ipad/iphone