NN4である日時になったら画像を消す方法

このQ&Aのポイント
  • NN4でも動作可能な方法で、特定の日時になったら画像を非表示にする方法を教えてください。
  • 先日、特定の日時になったら画像を非表示にする方法について教えていただきましたが、その方法をNN4でも実行できるように修正したいです。
  • 特定の日時を設定して、その日時になったら画像を非表示にしたいです。どのように修正すればよいでしょうか。
回答を見る
  • ベストアンサー

NN4で、ある日時になったら画像を消したい

先日、ある日時になったら画像を消す方法を教えて頂いたのですが、NN4でも動くように修正したいのですがどうすればいいかわかりません。 その時教えて頂いたソースは下記です。 function start(){ var limitTime="2006/04/10 11:50:30";//ある日時を設定して下さい。 var limitDate=new Date(limitTime); var nowDate=new Date(); defTime=limitDate-nowDate; if(defTime>0){ document.getElementById("img1").style.display="block"; document.getElementById("img2").style.display="block"; setTimeout("task()",defTime); }else{ document.getElementById("img1").style.display="none"; document.getElementById("img2").style.display="none"; } } function task(){ document.getElementById("img1").style.display="none"; document.getElementById("img2").style.display="none"; } どうすれば動くようになるのか教えて頂けないでしょうか。 よろしくお願いします。

質問者が選んだベストアンサー

  • ベストアンサー
noname#22259
noname#22259
回答No.3

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <head><meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>???</title> <script language="JavaScript" type="text/javascript"> function start(){ var limitTime="2006/04/10 12:20:30"; var limitDate=new Date(limitTime); var nowDate=new Date(); defTime=limitDate-nowDate; if(defTime>0){ if(document.layers){//NN4 document.layers['img1'].style.visibility='show'; document.layers['img2'].style.visibility='show';} else if(document.all){//ie4 document.all['img1'].style.visibility='visible'; document.all['img2'].style.visibility='visible';} else if(document.getElementById){//DOM document.getElementById("img1").style.visibility="visible"; document.getElementById("img2").style.visibility="visible";} else return false; setTimeout("task()",defTime); } else { if(document.layers){//NN4 document.layers['img1'].style.visibility='hide'; document.layers['img2'].style.visibility='hide';} else if(document.all){//ie4 document.all['img1'].style.visibility='hidden'; document.all['img2'].style.visibility='hidden';} else if(document.getElementById){//DOM document.getElementById("img1").style.visibility="hidden"; document.getElementById("img2").style.visibility="hidden";} else return false; } } function task(){ if(document.layers){//NN4 document.layers['img1'].style.visibility='hide'; document.layers['img2'].style.visibility='hide';} else if(document.all){//ie4 document.all['img1'].style.visibility='hidden'; document.all['img2'].style.visibility='hidden';} else if(document.getElementById){//DOM document.getElementById("img1").style.visibility="hidden"; document.getElementById("img2").style.visibility="hidden";} else return false; } </script> </head> <body> <!---- ---> </body> </html>

Java-Java
質問者

お礼

ありがとうございます。まだ試してはいませんが、参考にさせて頂きます。

その他の回答 (2)

noname#19206
noname#19206
回答No.2

NC4のユーザーはNN7,NB8のユーザーよりも少ない、本当にごく少数だと思います。 Netscape Communicator 4.x は特に CSS の実装状況が不十分であるため、 CSSを使用しているWebページを思い通りに表示することが出来ない可能性が高いです。 だからそういうのを認識した上で使う人くらいしかNC4ユーザーはいないから、 そこまで頑張って対応させる必要性は、あまりないのではないかと考えられます。

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

NNの環境が無いので正確な回答ではありませんが 可能性として2つ。 1つは日付形式の問題。 var limitDate=new Date(limitTime)が日付として 認識されているかどうか検証してください。 もう1つはDHTMLの問題。 NN4の頃はダイナミックにHTMLが書き換えられる ブラウザでしたっけ? またDHTMLが使えたとしてgetElementByIdで オブジェクトにアクセスできたかどうかも微妙です。 NNであれば伝統的なLayerオブジェクトでの 対応になるかもしれません。 いずれにしろ古いブラウザをどこまで対応する 必要があるかは見極めが必要です。 ブラウザのバージョンを確認して、場合によっては javascriptのないページに誘導するべきでしょう。

関連するQ&A

  • JavaScriptで時間指定をして表示を切り替え

    JavaScriptで時間指定をして表示を切り替えたいのですが safariだけうまく動作しません、下記のjsファイルを読み込んでHTML側には <div id="hoge1">切り替え前の内容</div> <div id="hoge2">切り替え後の内容</div> としています。 解決策があればご教授お願い致します。 window.onload = changeDisplay; function changeDisplay(){ var objDate = new Date(); var now = objDate.getTime();//現在のタイムスタンプ(ミリ秒)を取得 var changeTime = new Date("Jan 1, 2011 00:00:00");//切り替える日時のタイムスタンプ(ミリ秒)を取得 //切り替え前 if (now < changeTime) { document.getElementById('hoge1').style.display = "block"; document.getElementById('hoge2').style.display = "none"; setTimeout("changeDisplay()", 1000);//1秒ごとに実行(◯秒ごとの場合は、第2引数に 「◯ * 1000」 と記述) //切り替え後 } else { document.getElementById('hoge1').style.display = "none"; document.getElementById('hoge2').style.display = "block"; } }

  • 決まった曜日で一定時間だけ表示画像を切替えたい

    ホームページ内の一部で、 曜日指定で一定時間だけ表示画像を切替えたいのですが、 日付指定で変わるものばかりしか検索で見つけられずに困っております。 具体的には「毎週火曜日10:00~11:00」までは、自動でA画像を表示し それ以外はB画像を表示するようにしたいです。 現在は下記(日付指定で画像を変更)をなんとか変更すればできるかと思い 設置して動作させてみました。 ですが、私はJavaScriptに関して初心者なので 曜日指定と、再び元の画像表示に戻すのに どうしていいのか分かりませんでした。 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - window.onload = changeDisplay; function changeDisplay(){ var objDate = new Date(); var now = objDate.getTime();//現在のタイムスタンプ(ミリ秒)を取得 var changeTime = new Date("Jan 1, 2011 00:00:00");//切り替える日時のタイムスタンプ(ミリ秒)を取得 //切り替え前 if (now < changeTime) { document.getElementById('hoge').style.display = "block"; document.getElementById('hoge2').style.display = "none"; setTimeout("changeDisplay()", 1000);//1秒ごとに実行(◯秒ごとの場合は、第2引数に 「◯ * 1000」 と記述) //切り替え後 } else { document.getElementById('hoge').style.display = "none"; document.getElementById('hoge2').style.display = "block"; } } - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 参考サイト http://blog.aidream.jp/javascript/javascript-timed-display-change-402.html これを、どう変更すればよいのでしょうか? またあるいは、別によい記述方法はあるのでしょうか? 下記の過去の質問も拝見してみましたが、 参考サイトのリンク先もなくなっていたりして、分かりませんでした。。。 「曜日と時間を指定して表示画像を切り替える」 http://okwave.jp/qa/q1832822.html すみませんが、よろしくお願いいたします!

  • 文の折りたたみ

    ブログなどでよくある「続き」を折りたたみで表示する方法を教えて下さい。 ググってみたのですが、ブログのテンプレしか見つけられず、それを普通のページにどう応用したらいいのかがサッパリ分かりません。 ヘッダに <script type="text/javascript"> <!-- function showMore(varA1, varB1){ var123 = ('varXYZ' + (varA1)); varABC = ('varP' + (varA1)); if( document.getElementById ) { if( document.getElementById(var123).style.display ) { if( varB1 != 0 ) { document.getElementById(var123).style.display = "block"; document.getElementById(varABC).style.display = "none"; } else { document.getElementById(var123).style.display = "none"; document.getElementById(varABC).style.display = "block"; } } else { location.href = varB1; return true; } } else { location.href = varB1; return true; } } //--> </script> …と記述するのは分かったのですが、本文中をどうすればいいのか… お願いします。

  • ブラウザ判別

    テーブル行をスイッチによって表示非表示を切り替える機能を実装してるんですが IEではtable-rowを入れてもエラーを出し NNやFirefoxではblockを入れるとレイアウトが崩れてしまい IEの場合block、NNやFirefoxではtable-rowを判別していれるようにしたんですが 切り替えているとなぜかたまにblockが入ってしまうことがあります //ブラウザ判別 if (document.all) { var display = 'block'; } else if (document.getElementById) { var display = 'table-row' } if(switch_1 == "on"){ document.getElementById('row1').style.display = display; document.getElementById('row2').style.display = 'none'; document.getElementById('row3').style.display = display; } if(switch_1 == "off"){ document.getElementById('row1').style.display = 'none'; document.getElementById('row2').style.display = display; document.getElementById('row3').style.display = 'none'; } 何かおかしいのでしょうか もしくは代替方法があればご教示お願いします

  • IE6,7で折りたたみメニューの状態を記憶

    現在、下記のソースで折りたたみメニューを作っています。 var trList = new Array("treeMenu1","treeMenu2","treeMenu3","treeMenu4","treeMenu5","treeMenu6"); // ツリーメニューのリスト function exMenu(tName) { for (i=0; i<trList.length; i++) document.getElementById(trList[i]).style.display = "none"; var tMenu=(document.all)?document.all(tName).style:document.getElementById(tName).style; (tMenu.display=='none')?tMenu.display="block":tMenu.display="none"; } このメニューで開いたリンク先に飛んで、ブラウザの戻るボタンで戻ったとき、開いていたメニューが開いたままになるようにしたいのですが、FireFox,Safariではうまくいくのですが、IE6,7では閉じてしまいます。 なんとかならないでしょうか?

  • 1分毎にHTMLを切り替えるJavaScript

    <script> function getImageFile(date){ var dir = 'min_img/'; var ext = 'jpg'; var hour = date.getHours(); if(hour < 10){ hour = '0' + hour; } var minute = date.getMinutes(); if(minute < 10){ minute = '0' + minute; } return dir + hour + minute + '.' + ext; } function updateClock(){ var date = new Date(); var image = getImageFile(date); date.setTime(date.getTime() + 60 * 1000); var next_image = getImageFile(date); $('#clock').fadeOut(1000, function(){ $('#clock') .html('<img src="' + image + '"><img src="' + next_image + '" style="display:none;">') .fadeIn(1000); }); setTimeout('updateClock()', 60 * 1000); } $(document).ready(function(){ updateClock(); }); </script> <body> <div id="clock"></div> </body> 上記のJavaScriptは1分毎に画像が切り替えるものです。 画像でなく、インフレームでHTMLを表示したいのですが、うまくいきません。 <script> function getImageFile(date){ var dir = 'html/'; var ext = 'html'; var hour = date.getHours(); if(hour < 10){ hour = '0' + hour; } var minute = date.getMinutes(); if(minute < 10){ minute = '0' + minute; } return dir + hour + minute + '.' + ext; } function updateClock(){ var date = new Date(); var image = getImageFile(date); date.setTime(date.getTime() + 60 * 1000); var next_image = getImageFile(date); $('#clock').fadeOut(1000, function(){ $('#clock') .html('<a href="' + image + '"></a><a href="' + next_image + '" style="display:none;"></a>') .fadeIn(1000); }); setTimeout('updateClock()', 60 * 1000); } $(document).ready(function(){ updateClock(); }); </script> <body> <iframe id="clock"></a></iframe> </body> 宜しくお願いします。

  • javascript外部ファイル化の複数指定の質問です。

    javascript外部ファイル化の複数指定の質問です。 一つ目 ================================= try { document.execCommand('BackgroundImageCache', false, true); } catch(e) {} 二つ目 ================================= window.onload = function() { document.getElementById("home").onmouseover= function() {document.getElementById("sub_home").style.display="block"}; document.getElementById("home").onmouseout= function() {document.getElementById("sub_home").style.display="none"}; document.getElementById("sub_home").onmouseover= function() {document.getElementById("sub_home").style.display="block"}; document.getElementById("sub_home").onmouseout= function() {document.getElementById("sub_home").style.display="none"}; } この上記の2つのjavascriptを別々に外部ファイル化して、head内に読み込んでおります。 両方とも動作させたいのですが、下のwindow.onload のjavascriptしか動作しません。 両方、動作させるには、どのように記述すればよいのでしょうか? どなたか教えていただけませんか? よろしくお願い致しますm(_ _)m

  • document.getElementById( ).style.displayについて

    「document.getElementById( ).style.display」を使って スタイルシートを書き換え、画像とテキストの表示替えをしています。 Firefoxでは正常に動作するのですが、 IEでは「displayプロパティ」を取得できずに動作しません。 htmlは以下のとおりです。 どなたかお分かりになる方、教えていただけないでしょうか? よろしくお願いします。 ★javascriptの内容 function toggle(Aid,Bid,Cid,Did,Eid) { document.getElementById(Aid).style.display = 'none'; document.getElementById(Bid).style.display = 'inherit'; document.getElementById(Cid).style.display = 'inherit'; document.getElementById(Did).style.display = 'none'; document.getElementById(Eid).style.display = 'none'; } ★スタイルシートの内容 #page {width: 910px;} #ai{height: 33px;display:inherit;} #kaki{ height: 33px;display:none;} #img_ai{margin: 0px;float: left;display:none;} #img_kaki{margin: 0px;float: left;display:inherit;}

  • 続き] divの背景画像を、徐々に表示させるには?

    トップページの2つのdivボックスの背景画像を、徐々に表示されるようにするjavascriptを作って頂いたのですが、リピートをやめる方法を御教えいただくのを忘れてしまいました! (http://oshiete1.goo.ne.jp/qa3921804.html) リピートをとめるには、下記ソースをどのようにすればよろしいでしょうか? ------------------------------------------------------------ fade.js ------------------------------------------------------------ var after = 10; // 秒数を指定 var tid1; var tid2; window.onload = function () { fdi2(); tid2=window.setInterval("fdi2()", after*1000); }; function fdi2() { var img1 = document.getElementById("limg"); img1.style.visibility = "visible"; fadeIn("limg", 0); var img2 = document.getElementById("rimg"); img2.style.visibility = "visible"; fadeIn("rimg", 0); } function fadeIn(imgId, opacity) { if (opacity <= 100) { setOpacity(document.getElementById(imgId), opacity); opacity += 10; tid1=window.setTimeout("fadeIn('" + imgId + "'," + opacity + ")", 80); } else { window.clearTimeout(tid1); } } function setOpacity(img, opacity) { img.style.filter = "alpha(opacity:" + opacity + ")"; img.style.KHTMLOpacity = opacity / 100; img.style.MozOpacity = opacity / 100; img.style.opacity = opacity / 100; }

  • ジャバスクリプトの使い方

    現在、webサイトを製作中なのですが、ページの上部にメニューがあり、画面中央にロゴがあり、下部にはフッターがあるという画面構成を考えております。 上部のメニューにマウスポインタが乗ったときに、中央のロゴが消えて、上部メニューの説明を表示しようと思っています。 その際、マウスオーバーで対応しようと思っています。 以下、ジャバスクリプトのコードです。 ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー window.onload = function () {  document.getElementById( "logo" ).onmouseover= setlogo; document.getElementById( "myMenu1" ).onmouseover = setMyBody1; document.getElementById( "myMenu2" ).onmouseover = setMyBody2; document.getElementById( "myMenu3" ).onmouseover = setMyBody3; document.getElementById( "myMenu4" ).onmouseover = setMyBody4; document.getElementById( "myMenu5" ).onmouseover = setMyBody5;  document.getElementById( "myMenu6" ).onmouseover = setMyBody6;  document.getElementById( "myMenu7" ).onmouseover = setMyBody7; }; function setlogo() { setNoneAll(); document.getElementById( "logo" ).style.display = "block"; } function setMyBody1() { setNoneAll(); document.getElementById( "myBody1" ).style.display = "block"; } function setMyBody2() { setNoneAll(); document.getElementById( "myBody2" ).style.display = "block"; } function setMyBody3() { setNoneAll(); document.getElementById( "myBody3" ).style.display = "block"; } function setMyBody4() { setNoneAll(); document.getElementById( "myBody4" ).style.display = "block"; } function setMyBody5() { setNoneAll(); document.getElementById( "myBody5" ).style.display = "block"; } function setMyBody6() { setNoneAll(); document.getElementById( "myBody6" ).style.display = "block"; } function setMyBody7() { setNoneAll(); document.getElementById( "myBody7" ).style.display = "block"; } function setNoneAll() { document.getElementById( "logo" ).style.display =  document.getElementById( "myBody1" ).style.display = document.getElementById( "myBody2" ).style.display = document.getElementById( "myBody3" ).style.display = document.getElementById( "myBody4" ).style.display = document.getElementById( "myBody5" ).style.display =  document.getElementById( "myBody6" ).style.display =  document.getElementById( "myBody7" ).style.display = "none"; } ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー 上記のジャバスクリプトでマウスオーバー(上部メニューにマウスポインタが乗った場合中央のロゴが消えてメニューの説明が表示されます)が可能になるのですが、更にonMouseOutを使って、上部メニューからマウスポインタが離れたときに、中央にロゴを表示させる為の記述方法が分からなくて苦戦しております。 どなたかご指導頂けませんか? よろしくお願い致します。

専門家に質問してみよう