サイトにアクセスした際、数秒で消えるポップアップを作りたいのですが・・

サイトにアクセスした際、数秒で消えるポップアップを作りたいのですが・・

JavaScriptを全く知らないのですが、サイトにアクセスした際、数秒で消えるポップアップを作りたいと思い、
ECカレントさんが使用しているソースを改変して作成しようとして（下のURLからECカレントさんに遷移すると表示されます。）余計な（と素人目で見える）部分を削除したものを動かしたところ、表示はされるのですが出っぱなしになって消えてくれませんでした。
ECカレントさんのは価格コムからのお客さんのみに表示させているみたいですが、
今回作るのはそのような切り分けはいらないものなので、かなりシンプルなものになると思うのですが・・どなたか助けてください；；；；
振る舞いとしては、
htmlのdiv要素を予めdisplayプロパティで非表示にしておいたものを
jsで dislay:blockとdislay:noneを切り替えて表示させているものなのですが・・

（価格コムからECカレントに飛ぶと表示されます↓）
http://kakaku.com/item/K0000118251/shop74/?lid=s …

つくったソースは
【html】

<div id="popupbox">
<a href="#" target="_blank"><img src="/image/example_01.png" alt="参考ソース"></a><img src="/image/example_02.png" alt="閉じる" style="cursor: pointer;" onClick="closePopup()" />
</div>
<script type="text/javascript" src="/js/popup.js"></script>
<script type="text/javascript">Popup()</script>


【CSS】

body{
position:relative;
}

#popupbox{
width:353px;
height:330px;
position: absolute;
text-align: left;
top: 20px;
right:20px;
z-index: 10;
display: none;
}

【JAVASCRIPT】

function Popup(){
document.getElementById("popupbox").style.display = "block";
setTimeout("closePopup()",5000);
}

function closePopup(){
document.getElementById("popupbox").style.display = "none";
}

No.2 ベストアンサー 回答者： yyr446 回答日時： 2010/10/18 13:28

No.1です。

そもそも質問者様のコードでもうまくいくはずなんですよ。
提示されてる分だけにして、実際に試してみたら出来てます。
それで、提示されて無い部分に何かある（競合とは限らない）と
思って、回答のようなサンプルを書いてみただけです。

この回答へのお礼

なるほど、そういうことだったのですね・・
挿入しようとしているサイトには、他のjsがちょこちょこ走っているので
もうちょっと粘ってやってみたいとおもいます。
どうもありがとうございました！

お礼日時：2010/10/18 14:59

No.1 回答者： yyr446 回答日時： 2010/10/18 11:15

ご提示の方法で、５秒後に消えるはずですが、何故消えないのか？です。

　原理は同じですが、popup.jsの中身を
document.getElementById("popupbox").style.display = "block";
setTimeout(function (){
document.getElementById("popupbox").style.display = "none";
},2000);
だけにしておいて、
<div id="popupbox"></div>
の下に
<script type="text/javascript" src="/js/popup.js"></script>
だけ書いておけば、名前の競合による不具合は防げるかも．．．

この回答へのお礼

ありがとうございます。

名前の競合というのは“Popup”を複数使用しているから、ということでしょうか？
しかし、このソースだと“閉じる”ボタンが死んでしまうとおもうのですが、
そこを生かしたままにできるほうほうはないでしょうか。

お礼日時：2010/10/18 12:52