症状
見た目上は、期待通りにiframeのコンテンツ(ページ)がmainの上に表示されているのですが、
iframe上をタッチしても反応しないことがあります。
なんどか試した結果、mainの方を長くタッチしてから、iframeをタッチした際に
長くタッチしないとリンク先への移動がしないことがわかりました。
開いた直後だとiframe内の画像を軽くタッチしただけでもちゃんとリンク先には飛ぶようでした。
困っていること
長くタッチしなくても、通常通りタッチ(タップ)しただけでリンク先に飛ぶようにしたいです。
今の知識で調べたところ、重なり順の話しか出てこないみたいなので、何かしらのワードだけでも教えていただけると大変助かります。
よろしくお願いいたします。
ソースコード
メインのコンテンツの上にかぶさるように、
画像1枚を<a>タグで囲んで、iframeで表示させています。
※hoverなどの疑似要素の設定はしていません。
html
1<!DOCTYPE html> 2<html> 3<head> 4<meta charset="utf-8"> 5<meta name="viewport" content="width=device-width, initial-scale=1"> 6<style> 7iframe{ 8position: fixed; 9z-index: 1; 10width: 100%; 11height: 150px; 12} 13main{ 14z-index: 0; 15} 16</style> 17</head> 18<body> 19<iframe name="img_header" src="https://example.com/index.html" scrolling="no" frameborder="0" id="smp_item_header"></iframe> 20<main> 21コンテンツ 22・ 23・ 24・ 25・ 26</main> 27 28</body> 29</html>
あなたの回答
tips
プレビュー