2016-12-27 6 views
0

私は2つのフォームを持っていますが、1つはユーザーからの入力で、別のフォーム(ポップアップウィンドウ)はデータを実行し、結果をユーザーに表示します。 2番目のフォーム、つまりポップアップウィンドウでデータを実行するまでに時間がかかることがあるので、ユーザーはそのポップアップウィンドウを閉じて、ネットワークに問題があると感じることがあります。
だから私は、ユーザーがそのポップアップウィンドウを閉じないようにしたい。だから私はすべての上に余分なdivは私の問題を並べ替えると思う。いくつかの例も試しましたが、問題は解決しません。私は、ポップアップウィンドウの上にdivを配置したい。出来ますか?私を助けてください。divをインバイドポップアップウィンドウの上にも置く

+0

jsfiddleを作成するか、コードを投稿してください。 –

+1

'position:fixedまたはabsolute'と' z-index'を使用してください –

+0

またはタイトルバーを隠す方法はないので、ユーザはウィンドウを閉じることができません –

答えて

0

ポップアップウィンドウではブラウザのポップアップウィンドウを意味する場合は不可能です。この場合、達成するためではないブラウザコードを変更する必要があるためです。 私がお勧めしたいのは、バックグラウンドで処理している間は、ユーザーにプロセスバーの情報メッセージを表示するのにどれくらい時間がかかっても問題ではないということです。

+0

ありがとうCengiz ..そう、私はプロセスボタンをクリックするとすぐにローダーを追加しようとしています。そのローダーの上にポップアップウィンドウが開いています。それに時間がかかるとユーザーは閉じる(X)ボタンをクリックします。私は止めたいと思う。 –

+0

このような状況のためにjsfiddleを作成できるのであれば、私は助けようとします。 –

+0

実際に私はjsfiddleについて何も知らない。私はこの事を試して私のコードを投稿する必要がありますか? –

0

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>

0

からいくつかのコードは、それのためのソリューションです。

フォームを送信した後、ユーザーにポップアップを表示します。ポップアップで、読み込みアニメーションを追加します。そのユーザーは、何かがバックグラウンドで働いていることを知っています。 http://loading.io/

フォームからの計算が完了したら、その読み込みアニメーションを削除し、計算された値をそのdivに置き換えてそのdivに置き換えます。そのためにはjavascriptまたはjqueryが必要です。

+0

ありがとうございますGijo ..私はすでにこのコンセプトを試みました。ユーザーは数分後にクローズ(X)ボタンをクリックします。彼らは忍耐も持たない。私がしたいことを達成できなかったなら、あなたが言ったことを実行しますか? –

+0

その閉じるボタンを削除;)しかし、なぜその '分'を取るのですか?誰もそれほど待ちません! 別の解決策は、フォームのボタンの横にアニメーションを読み込むことです。計算が完了すると、結果がポップアップに表示されます –

+0

ブートストラップからモーダルを試してみましょう。その非常に良いhttp://www.w3schools.com/bootstrap/bootstrap_modal.asp –

関連する問題