5

サムスンギャラクシータブでeラーニングが行われるATMでこのプロジェクトに取り組んでいます。ゲームは単なるウェブサイトですが、アプリとして表示されます。

初めてログインすると、このウェルカムメッセージを含むポップアップが表示され、その後ろに透明度のある黒いオーバーレイが表示されます。

問題は、Firefoxを使用しているPCではすべて正常に機能しますが、タブレットではZ-indexが機能しないように見えることです。デバッグすることは不可能であり、この問題に関するドキュメントを見つけることができませんでした。では、z-indexがタブレットで異なる動作をするかどうか、またはどうすれば修正できるかを誰かが知っていますか？

ポップアップにはz-index999があり、オーバーレイはz-index 998です。これに関するアイデアはありますか？私はグーグルで検索を続け、私が行ったすべての進捗状況を投稿します。

編集：オーバーレイはJqueryで作成されます：var showPopup ='<％= ViewData（ "showPopup"）。toString（）％>'

if (showPopup == "True") { $('body').prepend('<div class="overlay"></div>'); $('#welcomeBox').show(); }

今すぐ解決しました。解決策についてはコメントを参照してください。

4

2 に答える 2

10

パーティーに遅れましたが、これに対する最善の解決策は-webkit-transformを追加することでした：translate3d（0,0,0）; 絶対位置にあり、zインデックスが付けられているアイテムに。毎回私の問題を解決しました。

于 2013-05-16T01:51:52.790 に答える
0

答えが見つかりました、答えは部分的にstackoverflowにありました：Android Webkit：絶対に配置された要素はz-indexを尊重しません

残りはチュートリアルで見つかりました。

解決策は次のとおりです。

jQueryにオーバーレイを追加しましたが、ポップアップはhtmlにありましたが、非表示になっています。そのため、コードのその部分をjQueryチェックにも追加しました。ポップアップがオーバーレイの不透明度を継承するのを防ぐために、$('body').prependもう一度使用する必要がありました。すべてが機能するようになりました。

于 2011-11-29T08:10:39.437 に答える