私は2つのフォームを持っていますが、1つはユーザーからの入力で、別のフォーム(ポップアップウィンドウ)はデータを実行し、結果をユーザーに表示します。 2番目のフォーム、つまりポップアップウィンドウでデータを実行するまでに時間がかかることがあるので、ユーザーはそのポップアップウィンドウを閉じて、ネットワークに問題があると感じることがあります。
だから私は、ユーザーがそのポップアップウィンドウを閉じないようにしたい。だから私はすべての上に余分なdivは私の問題を並べ替えると思う。いくつかの例も試しましたが、問題は解決しません。私は、ポップアップウィンドウの上にdivを配置したい。出来ますか?私を助けてください。divをインバイドポップアップウィンドウの上にも置く
答えて
ポップアップウィンドウではブラウザのポップアップウィンドウを意味する場合は不可能です。この場合、達成するためではないブラウザコードを変更する必要があるためです。 私がお勧めしたいのは、バックグラウンドで処理している間は、ユーザーにプロセスバーの情報メッセージを表示するのにどれくらい時間がかかっても問題ではないということです。
ありがとうCengiz ..そう、私はプロセスボタンをクリックするとすぐにローダーを追加しようとしています。そのローダーの上にポップアップウィンドウが開いています。それに時間がかかるとユーザーは閉じる(X)ボタンをクリックします。私は止めたいと思う。 –
このような状況のためにjsfiddleを作成できるのであれば、私は助けようとします。 –
実際に私はjsfiddleについて何も知らない。私はこの事を試して私のコードを投稿する必要がありますか? –
Uは、非常に高いz-インデックス(9999)のオーバーレイを持つことができ、操作が完了したらオーバーレイを削除して、毎回オーバーレイを開閉するためにfunctions-とcloseNav()
を呼び出します。
サイトここw3schools
<!DOCTYPE html>
<html>
<style>
body {
margin: 0;
font-family: 'Lato', sans-serif;
}
.overlay {
height: 100%;
width: 0;
position: fixed;
z-index: 9999;
top: 0;
left: 0;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0, 0.9);
overflow-x: hidden;
transition: 0.5s;
}
.overlay-content {
position: relative;
top: 25%;
width: 100%;
text-align: center;
margin-top: 30px;
}
overlay a {font-size: 20px}
.overlay .closebtn {
font-size: 40px;
top: 15px;
right: 35px;
}
}
</style>
<body>
<div id="myNav" class="overlay">
<div class="overlay-content">
<div style="color:white;">Wait ...</div>
</div>
</div>
<script>
function openNav() {
document.getElementById("myNav").style.width = "100%";
}
setTimeout(function closeNav() {
document.getElementById("myNav").style.width = "0%";
},4000);
openNav();
</script>
</body>
</html>
からいくつかのコードは、それのためのソリューションです。
フォームを送信した後、ユーザーにポップアップを表示します。ポップアップで、読み込みアニメーションを追加します。そのユーザーは、何かがバックグラウンドで働いていることを知っています。 http://loading.io/
フォームからの計算が完了したら、その読み込みアニメーションを削除し、計算された値をそのdivに置き換えてそのdivに置き換えます。そのためにはjavascriptまたはjqueryが必要です。
ありがとうございますGijo ..私はすでにこのコンセプトを試みました。ユーザーは数分後にクローズ(X)ボタンをクリックします。彼らは忍耐も持たない。私がしたいことを達成できなかったなら、あなたが言ったことを実行しますか? –
その閉じるボタンを削除;)しかし、なぜその '分'を取るのですか?誰もそれほど待ちません! 別の解決策は、フォームのボタンの横にアニメーションを読み込むことです。計算が完了すると、結果がポップアップに表示されます –
ブートストラップからモーダルを試してみましょう。その非常に良いhttp://www.w3schools.com/bootstrap/bootstrap_modal.asp –
- 1. 子divを親divの外側に置く(左/上)
- 2. divタグの上にdivタグを置く方法
- 3. divをdiv内に置く
- 4. ワードプレスサイトの上にあるdiv定数をイメージに置く
- 5. divを別のものの下に置く方法
- 6. 別のdiv内の画像の上にdivを置く方法は?
- 7. タグ入力 - 入力の上にdivを置く
- 8. divの上に保存ボタンを置く方法
- 9. divをもう一方の下に置く
- 10. 下位に固定されたdiv要素を上に置く
- 11. divの上にテキストを配置する
- 12. divにイメージを置く方法はdivよりも大きいですか?
- 13. divの上に正確にdivを配置する
- 14. オーバーフローしたdiv上にdivが正しく配置されない:hidden
- 15. 子divを親divの上に配置する
- 16. divをjQueryを通じて特定のページのフッターの上に置く方法
- 17. 置き、他のDIVの上にDIVとイメージ
- 18. 別のdivの上にマウスを置いてdivをもう一度開きます。
- 19. divをfloatの下に置く:left divs
- 20. css divを含むdivの一番上にdivを配置する方法
- 21. ページがスクロール可能な場合でも画面上にdivを配置する
- 22. ワードプレスのテーマの上の位置div
- 23. 画像の上の位置div
- 24. Z-indexを使ってdivを別のdivの上に置くことを拒否する
- 25. 本当にウィンドウを他のものより上に置く方法 - Linux PyGTK
- 26. Fixed Divの一番上を親のdivの下に配置します。
- 27. セレンの上にマウスを置く
- 28. テーブルの上にヘッダーを置く
- 29. Navbarをウェブサイトの上に置くコンテンツ
- 30. NSTableViewと列の上にカーソルを置く
jsfiddleを作成するか、コードを投稿してください。 –
'position:fixedまたはabsolute'と' z-index'を使用してください –
またはタイトルバーを隠す方法はないので、ユーザはウィンドウを閉じることができません –