java script
マウスに追従する 画像について。
実装はできるのですが、こういった事象で困っています。
「縦スクロールに対して追いついてこない」
「1スクロール分したに移動するたびにおいてきぼりになる。」
このサイトも同じ事になってしまってます。
http://ameblo.jp/ma-reete/entry-10445768523.html
という事です。
以下、スクリプトでは間違っているのでしょうか。
回答お願いします。
（当方IE8試用、ＦＦではみれないようですね。）
<script language="JavaScript"><!--
function moveImage()
{
x = event.x;
y = event.y;
document.getElementById("myIMG").style.left = x;
document.getElementById("myIMG").style.top = y;
}
// --></script>
<link href="style.css" rel="stylesheet" type="text/css" /></head>
<body onMousemove="moveImage()">
<!--mouse 画像 start-->
<IMG src="image/common/mika002.gif" id="myIMG">
<!--mouse 画像 start-->
投稿日時 - 2010-05-06 15:54:16
#2です。
手元のIE6では動作するようです。
IE8がないので確認できませんが、仕様変更されている可能性がありそう。
event.xは変わっていないと思いますので、document.allかdocument.bodyか…
まぁ、
document.all["ID"] は document.getElementById("ID")
などにしておいたほうが無難かと。
http://yakinikunotare.boo.jp/orebase/index.php?Javascript%2F%A5%DE%A5%A6%A5%B9%B0%CC%C3%D6%A4%F2%C3%CE%A4%EB#b10df9fb
（↑）によればIE7では、document.bodyがdocument.documentElementになっているみたい。
一方で、IE7はdocument.bodyでもいけてるみたい。（↓）
http://archiva.jp/web/javascript/get_mouse-position.html
IE8はわからないけれど、このあたりがあやしいのでは？
ところで、どのような環境での利用をお考えか不明ですが、IE限定でよいのでしょうか？
個人ユースのスクリプトなのか、HPならIE限定のページとかなのかな？
投稿日時 - 2010-05-07 13:01:22
補足
きっと、ＦＦ、ＩＥをフォローできればＯＫだと思います。
元請からの要請なので。しかし、下にもありましたように元々ＩＥでフォローをいう事だったのでＦＦは無理と私は判断しております。
投稿日時 - 2010-05-07 23:11:17
14人が「このQ&Aが役に立った」と投票しています
ベストアンサー以外の回答（2件中 1～2件目)
検索すると同じスクリプトがあちこちに見られるので、よほど使いまわされているのだとは思うけれど、少々古い感じは否めません。
どれが元なのかわからないけれど、基本的に気になる点が2箇所。
1）画面のスクロール分を考慮していないので、追随しきれない。
2）元はIE専用のスクリプトとして作成されていたはず。
（なので対応していないブラウザがある。例えばFireFox）
1）に対してはこんな感じでいけるはずですが、ブラウザ限定は変わらない。
（document.allとかevent.xとか）
http://javascript.eweb-design.com/0903_mi.html
http://www.webstudio.jp/web_studio/tech/files/m018/m018.htm
2）も考慮するなら、こんな感じ
http://www.shuraba.com/?p=computing/js/scroll
実装例（スクロール部分しか実装してないけれど。しかもtopのみ）
http://jsajax.com/Articles/alwaysmenu/307
投稿日時 - 2010-05-06 17:43:27
補足
１）http://javascript.eweb-design.com/0903_mi.html
を参考に 実装してみましたが、
やはり 置いてきぼりになってしまいます..なにかエラーが起こっているのでしょうか？
以下現在の状況。 参照
<title></title>
<SCRIPT language="JavaScript">
function mouseImage() {
document.all["ID"].style.left= event.x + 8 + document.body.scrollLeft;
document.all["ID"].style.top = event.y + 16 + document.body.scrollTop;
}
document.onmousemove = mouseImage;
</SCRIPT>
<link href="style.css" rel="stylesheet" type="text/css" /></head>
<body>
<!--mouse 画像 start-->
<div id="ID" style="position:absolute;"><IMG src="image/common/002.gif" id="myIMG"></div>
<!--mouse 画像 start-->
投稿日時 - 2010-05-06 22:58:38
OKWaveのオススメ
おすすめリンク
