マウス追従スクリプトについて

質問

マウスポインタを追いかけるスクリプトを使ったのですが・・・ 画像は表示されきちんとマウスを追いかける星も出ました。（スクリプト自体は借り物なので何もいじっていません。画像を変えたくらいです。）

でもその他に貼り付けている画像の所にくるとその下にいっているのか
隠れて出てきません。

どうやったら解決するのでしょうか？

回答No.3

noname#199778 · ベストアンサー

マウスを追従する画像のHTMLは、#1の補足にある部分のスクリプトで書き出しているようです。 それで、そこのスタイルシートについては、<img>タグそのものではなくて、その上の<div>タグに対して適用するような形になっていると思われます。
この他に、head部分に以下のような記述があるのではないでしょうか。

<style type="text/css">
<!--
.movingobject{position: absolute; left: **; top: **;}
-->
</style>

上記のような記述があれば、それがマウスを追従する画像に対して適用されるスタイルシートになると思います(内容が少々異なるかもしれませんが、「.movingobject」で始まる行があれば、それが当該のスタイルシート指定になります)。
このスタイルシートの指定に、z-indexを追加すれば、解決できると思います。

お礼

できましたーーーーーヾ(＠⌒▽⌒＠)ノワーイ!

<!--
.movingobject { position:absolute; left:-200px; top:0px; visibility:visible; z-index: 10; }

ここにありました！スクリプト内ではなかったんですね。
最後にz-indexを10として追加したら画像の上をくるくる回っておりますーー本当にありがとうございました(*- -)(*_ _)ペコリ

回答No.2

noname#199778

推測でのアドバイスをしますが…

マウスを追いかける画像のスクリプトはスタイルシートを利用していると思います。
スタイルシートでは、画像の重ね合わせの順番を規定するz-indexという属性があって、その属性が設定されている場合はその値が大きい順に画像が前面に出るように表示されます。
z-indexの指定がない画像とz-indexを1に指定した画像の表示位置が重複している場合、後者の方が前面に出されるような形で重ね合わせの表示がされるようになります。
同様に、z-indexが2に指定されている画像と、z-indexが4に指定されている画像とでは、z-indexが4に指定されている画像の方が前面に出されて重ねあわせ表示がされるようになっています。

おそらくは、マウスを追いかける画像を呼び出している部分でのスタイルシートの指定でz-indexが設定されておらず、またその他のマウスを追いかけるものではない画像のスタイルシートにz-indexが設定されているのではないでしょうか。
その場合でしたら、マウスを追いかける画像を呼び出している部分のスタイルシートでz-indexを他の画像で使用されているz-indexの値よりも大きくとれば、元から表示されている画像の上を、マウスを追いかける画像が飛ぶようになると思います。
とりあえず、<img>タグの周りを良く調べてみて、スタイルシートにz-indexが表示されていない画像を探し、その画像のスタイルシートにz-indexを記述すれば、解決できるのではないかと思います。
もしかしたら、JavaScriptのdocument.write()の中に記述されているかもしれませんので、スクリプトの中も良く調べてみてください。 仮に

document.write("<img src='***' style='position: absolute\;'>");

などのような表記があれば、おそらくはそれがマウスを追いかける画像を書き出している部分になりますので、そこのスタイルシートにz-indexを設定してみてください。

回答No.1

noname#199778

どのような内容のスクリプトをお使いになっているのかがわからないので、どのように対処すればお望みの結果になるか、適切に指摘することが難しいと思います。
どのようなスクリプトとHTMLソースを記述しているのかを補足していただければ、対処法も見えてくるかと思います。

とりあえず、あてずっぽうの対策ですが、そのマウスを追いかけている星の画像をHTMLで書き出しているのであれば、そのスタイルシートのz-indexを大きく指定してみてはいかがでしょうか(例：<img src="***" id="++" style="position: absolute; z-index: 10;">等)。

もしこれで対処できなかったら、現在のマウスに追従する画像の表示部分のソースを補足してみてください。

補足

function MovingObject(num, src, width, height)
{
document.write('<div id="MVOBJ',num,'" class="movingobject">');
document.write('<img src="',src,'" width="',width,'" height="',height,'">');
document.write('<\/div>');
if (document.layers) {
this.objstyle = document.layers["MVOBJ"+num];
} else if (document.all) {
this.objstyle = document.all["MVOBJ"+num].style;
} else if (document.getElementById) {
this.objstyle = document.getElementById("MVOBJ"+num).style;

img srcはここらへんなのですが・・・