• 締切済み

javascriptがChromeで機能しません

ご質問させていただきます。 リンクにオンマウスするとカーソルのそばにバナーを表示させるjavascriptをHTMLに組み込みました。 IEでは正常に機能するのですが、Chromeではバナーがカーソルのそばではなくページの一番左上に表示されてしまいます。 どのようにソースを記述すれば改善されるのか、教えていただけないでしょうか。 javascriptに関しては初心者なので、困っております。 何卒宜しくお願い致します。 因みに、javascriptは http://lll.s21.xrea.com/m/link/38.html を参考にして書きました(ここでは、Chromeでオンマウスすると文章が一番右下に表れてしまいます)。 <html> <head> <script type="text/javascript"> <!-- function on(text) { document.getElementById('banner').innerHTML=text; frame.style.posLeft =document.body.scrollLeft+window.event.clientX+10; frame.style.posTop =document.body.scrollTop+window.event.clientY-10; document.all('frame').style.display="block"; } function off() { document.all('frame').style.display="none"; } // --> </script> <div style="border:1px solid #ddd; background:#fff; padding:5; display:none; position:absolute;" id="frame"><span id="banner"></span></div> </head> <body> <a href="サイトアドレス" target="_blank" onmouseover="on('<img src=\'バナーアドレス\'>')"; onmouseout="off()">サイト名</a> </body> </html>

みんなの回答

  • Ogre7077
  • ベストアンサー率65% (170/258)
回答No.3

いくつかイケテない点を併せて修正 function on(text) { var ev = window.event; // TODO Mozilla 系へ対応。できれば addEventListener へ移行 var x = ev.pageX || ev.clientX + (document.documentElement || document.body).scrollLeft; var y = ev.pageY || ev.clientY + (document.documentElement || document.body).scrollTop; var frame = document.getElementById('frame'), banner = document.getElementById('banner'); banner.innerHTML = text; frame.style.left = (x + 10) + 'px'; frame.style.top = (y - 10) + 'px'; frame.style.display = 'block'; } 要素の位置がよろしくない <head><div id=frame> ... <body> ... 一般的には <head> ... <body><div id=frame> ...

  • ONEONE
  • ベストアンサー率48% (279/575)
回答No.2

ちなみに<head>の中に<div>が入っていますがこれは転記ミスということですよね。

  • ONEONE
  • ベストアンサー率48% (279/575)
回答No.1

frame.style.left frame.style.top に変更してください。 IE, chromeでは確認できましたが、 firefoxではwindow.eventがないので動きません。