- 締切済み
それぞれにオンマウス動作
下記のタグで memberのオンマウス動作はできましたが、 live scheduleのオンマウス動作が分かりません。 （live scheduleもmemberとおなじようにそれぞれ独立してフェードインで出現させたいのです。） 色々試しても、オンマウスで同時にフェードインしたり、両方とも動かなくなったりでどうしたらいいか分からなくなりました。 教えてください。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title></title> <style type="text/css"> <!-- p { font-size: 50px; font-family: "MS PMincho"; text-decoration:none; } --> </style> <SCRIPT LANGUAGE="JavaScript"> <!-- // itv = 50; // cnt = 0; function strFade(str) { c = str.charAt(cnt++); document.all["ID"].style.color = "#"+c+c+c+c+c+c; if(cnt < str.length) setTimeout("strFade('" + str + "')",itv); if(cnt == str.length) cnt = 0; } //--> </SCRIPT> </head> <body> <div> <p style="margin-top: 200px;"> <p><b> ｍ </b></p> </div> <p style="margin-top: -20px;"> <p><span onmouseover="this.innerText=' liｖｅ ｓｃｈｅｄｕｌｅ'" onmouseout="this.innerText=' i'"> i </span></p> <p style="margin-top:-130px;"> <font color='#ffffff'> <SPAN id="ID"><span onmouseover="strFade('fedcba9876543210')" onmouseout="strFade('0123456789abcdef')"><p><a> ｍｅｍｂｅｒ</a></p></SPAN><BR><BR></font> </BODY> </HTML>
- taku6215
- お礼率66% (2/3)
- JavaScript
- 回答数1
- ありがとう数0
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- seta_takahiro
- ベストアンサー率60% (23/38)
ポイントは「cnt」という変数がグローバルで定義されていることではないどでしょうか。 そのために、memberの方でstrFadeが呼ばれた後、live scheduleの方でも呼ばれると、cnt変数を共有してしまい、動作がおかしくなるんだと思います。 ということで、strFadeにcntという引数を渡すようにした、次はどうでしょう。(長いので元のHTMLを削っています) フェードイン中にフェードアウト開始したりする場合などは考えていません。 <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <SCRIPT LANGUAGE="JavaScript"> <!-- itv = 50; function strFade(str, id, cnt) { c = str.charAt(cnt++); document.getElementById(id).style.color = "#"+c+c+c+c+c+c; if(cnt < str.length) setTimeout("strFade('" + str + "', '" + id +"'," + cnt +")",itv); if(cnt == str.length) cnt = 0; } //--> </SCRIPT> </head> <body> <SPAN id="schedule" onmouseover="strFade('fedcba9876543210', 'schedule', 0)" onmouseout="strFade('0123456789abcdef', 'schedule', 0)">live schedule</SPAN> <SPAN id="member" onmouseover="strFade('fedcba9876543210', 'member', 0)" onmouseout="strFade('0123456789abcdef', 'member', 0)">member</SPAN> </BODY> </HTML>
