- 締切済み
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>
- みんなの回答 (3)
- 専門家の回答
みんなの回答
- Ogre7077
- ベストアンサー率65% (170/258)
いくつかイケテない点を併せて修正 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> ...