• 締切済み

NowLoadingの設置

お世話になります。 javascript初心者ですが宜しくお願いします。 ページが移動する際に『NowLoading』と表示されるようにしたいのですが、window.onloadを使うと次の画面が出てからしか表示されません… 私の作ったページ(PHP)の場合、次の画面を読み込むのに時間がかかるためステータスバーに『 *** の応答を待っています』と出るのですが、そのときに『NowLoading』を表示させたいのです。 このとき1ページ目の画面が出たままで2ページ目は表示されていません。 oncickを使う事も考えたのですが、応答待ちを調べる方法はないかと思い質問させていただきました。 簡単な解説ページなどご存知でしたら教えていただければ幸いです。 どうぞ宜しくお願いします。

  • riko4
  • お礼率50% (2/4)

みんなの回答

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

次の画面表示のきっかけは、リンクをクリックということでいいのでしょうか? <a>タグにonclickを設定してJavaScriptを実行すると、リンクのロード前にScriptが実行されますので、ScriptでNowLoadingを表示するようにしておけばいけます。 NowLoadingの表示は、通常は非表示のブロックをつくっておいてScriptで切り替えるとか、別ウィンドウを開いて表示するとかいろいろ考えられます。 とりあえず、別ウィンドウの例を。 <a href="test.html" onclick="mesDisp();">testへ</a> などとしておいて・・・ <script type='text/javascript'> <!-- function mesDisp() {  var w =window.open("about:blank","Message","width=300,height=200");  w.document.writeln("<html><body><b>NowLoading!</b></body></html>"); } //--> </script> サイズとかは適当です。1行目のabout:blankをNowLoading表示用のhtmlにしておけば、2行目のw.document.writeln~は不要です。 次画面のソースのonloadでMessageウインドウをクローズするようにしておけば、読み込み終了時にクローズされます。 (もちろん、別ウィンドウ以外の方法で表示するならば、クローズの処理は不要になります。)

riko4
質問者

お礼

リンクタグの前に設置する事で無事に思っていた動作をするようになりました。 新しいウインドウを作っての方法は考えていなかったのですが、この方法を使っても面白そうですね。 色々と勉強になりました。 ありがとうございます。

関連するQ&A

  • NowLoadingについて

    おしえて!!FLASH 8の勉強をされた方に、お聞きしたいのですが 243ページの7の箇所で「写真の場合はNowLoadingを仕掛けるのは無理。そこで一工夫して、ターゲットとなるムービークリップの下のレイヤーに「NowLoading」の文字を入れておく。読み込み終わるまではこれが表示される仕組み」とありますが、ダウンロードシミュレートをしてもNowLoadingが表示されません。どうしてでしょうか?よろしくお願いします。超初心者です。

  • window.onloadが、ブラウザ(Firefox)で戻る場合に動作しない

    「Flash版地図API」の導入作業をしています。 地図内にマーカーを付けるために、以下のように記述しました。 <script language="JavaScript" type="text/javascript"> <!--常にマーク表示--> window.onload = function() { thisMovie('YFMap').addIcon('tokyo', '35.60714835619635', '139.3955620148672', '<a href="/">東京'</a>, 'L1'); } </script> window.onload は、ブラウザを開くたびに実行されると思います。 IEでは、問題ないのですが、Firefoxの場合、表示されたマークをクリックして次のページへ移動して、その後、ブラウザで戻ってくると、マークが表示されないのです。 どうやら、Firefoxの場合、「window.onload」は、ブラウザから戻ってきた場合は動作していないのでは?と想像しています。 この場合、どのように記述するのが良いのでしょうか?ご指導宜しくお願い致します。 ※ javascriptの知識はほとんどありませんので、具体的なソースで教えて頂きたいです。

  • 画面の表示位置を指定させて表示させたいのですが、カクカクさせずに表示さ

    画面の表示位置を指定させて表示させたいのですが、カクカクさせずに表示させるにはどうしたらよいでしょうか? 下記書き方だと一度普通に表示されて、それから移動するみたいで、 一瞬、画面がカクカクしてしまいます。 初めから、移動させた状態で画面を表示させるには、どうしたらよいでしょうか? <body onload="init();"> <script type="text/javascript"> function init(){ window.scrollTo("0","200"); } </script>

  • history.back使用時、ページトップへ移動

    お世話になります。 javascriptのonClick="history.back()"で前ページに戻った際、ページの最上部に移動したいのですが、どのように書けば良いでしょうか。 history.back先のページに window.onload = function () {$(window).scrollTop(0);} と書いたのですが、最上部に移動せず悩んでおります。 お時間がある際に、ご回答いただけましたら嬉しいです。

  • ページが完全に読み込まれるまでNowLoadingを表示したい

    フレームで分割したページがあり、このページでCSVやテキストデータの取込みを行っています。 取込むデータを一度画面表示しているのですが、取り込む件数が多いと時間がかかってしまうので、 処理中に「Now Loading...」などの言葉を表示させたいのですが何も表示されません。 header.asp(取り込むファイルを指定) footer.asp(取込みファイルを画面表示) ↓ここのページを参考にしたのですが、フレーム分割されているのでonloadが機能していない? http://www.openspc2.org/reibun/JS_TipsAndTricks/etc/010/index.html フレームで分割されたぺーじでも同じような処理をさせるにはどうしたらよいでしょうか? よろしくお願いします。

  • ブラウザの頁内移動についての質問です。

    ブラウザの頁内移動についての質問です。 私は現在、Javascript+PHPでSNSアプリを作成しています。 SNSアプリはプラットフォーム(SNS)上のframe内で動作します。 アプリの表示位置移動をwindow.window.scrollToが使用できないので location.hashを使用して行なっているのですが、IEでlocation.hash を使用するとブラウザの戻るボタンが挙動が意図しない動作になります。 オンロード時に以下の処理を実行します。 onload() { location.hash="#PageTop"; // アプリのトップを画面のトップに移動する 以降の処理 } この後、戻るボタンをクリックしても前の頁には戻らす、onload()の処理が 実行されます。 firefox、Chromeなどは前のページに戻ってくれるのですがIEだと 上記のようになり無限ループのような状況になります。 オンロード時に「アプリのトップを画面のトップに移動する」処理は必須であり ますのではずせません。 他に頁内移動する方法か、IEでlocation.hashを設定しても前の頁に戻れる 方法がお分かりの方、お教えいただくと非常に助かります。

  • alertを出さないと、正常に動作しない

    Javascript初心者です。 現在JavascriptからPHPにデータを送信して、PHP側でデータをjsonで送信し Javascriptで受取り、データを表示しようとしています。 以下、サンプルです。 var jsonData; function aaa(){ var jsonText = XMLHttpRequest(phpからのjson受取) eval('jsonData=' + jsonText ); } function bbb(jsonData){ alert(); //←不要なアラート alert(jsonData[0]); } window.onload = function SetUp(){ aaa(); bbb(jsonData); } bbb内の最初のアラートを出すと、次のアラートでちゃんとデータを表示するのですが、 bbb内の最初のアラートを出さないと、次のアラートでデータが表示されません。 この最初のアラートを出さずにデータを取得する方法はあるのでしょうか? よろしくお願い致します。

  • javascriptからphpの呼び出し

    javascriptの初心者です。宜しくお願い致します。 php5で、開発していますが、javascriptからphpを呼んで、 結果をリアルタイムに画面に表示させる方法が分かりません。 【やりたい事】 1.画面上に、現在の日時を表示させる。 2.5秒毎に、phpを呼び出し(DB接続し結果を取得)して、   その結果を、画面上に表示させる。   ※DBへの接続は、javascript内ではやりたくありません。 下記に、現在時刻を表示するjavascriptがありますが、 この中で、5秒毎に、phpを呼び出したいのですが、 出来るのでしょうか? </head> <script language="Javascript"> <!-- function time_disp() { d = new Date(); document.all.nowdate.value = d.toLocaleString(); window.setTimeout("time_disp()", 1000); } --> </script> <body onload="time_disp();"> <input type="text" name="nowdate" size="30" readonly> <input type="text" name="data1" readonly> ←phpから取得した値1 <input type="text" name="data2" readonly> ←phpから取得した値2 </body>

  • JavaScriptの表示についておねがいします。

    JavaScriptで、以下のスプリクトのページを表示する部分を10秒ごとにしたいのですがどなたか教えて頂けないでしょうか?出来れば、追記して回答お願いします。 <html> <body> </scr ipt> </head> <body onLoad="openWindow1()"> <a href="javascript:openWindow1();">web表示</a> <SCRIPT language="JavaScript"> <!-- // サブウィンドウの表示方法を指定する function openWindow1() { window.open("http://yahoo.co.jp/","1"); window.open("http://www.google.co.jp/","2"); window.open("http://ja.wikipedia.org/wiki/メインページ","3"); } //--> </SCRIPT> </body> </html>

  • ページ読み込み時に自動でスクロール

    <body>にonloadを記述する方法以外で あるページを読み込んだ時に、自動的にページ最下部へ スクロールさせたいのですが 以下コードを記述してもエラーも起こらず、何も起きませんでした。 <script type="text/javascript" language="javascript"> <!-- window.onload = new function(){ window.scrollBy(0,300) }; window.onload = new function(){ alert("aaa") }; // --> </script> ちなみに、下側のalertは問題なく動作しております。 scrollby以外でのスクロールでもいいので、ご存じの方教えて下さい。 (できれば一瞬でスクロールする方がいいです。)

専門家に質問してみよう