画像の一部を選択した時のみマウスポインタを変更

解決済

質問者：hukazuo
質問日時：2009/02/19 15:53
回答数：1件

<img src="img.gif" usemap="#sample" border="0">
<map name="sample">
<area shape="rect" coords="10,10,10,10" alt="sample" name="ex">
<area shape="rect" coords="10,10,10,10" alt="sample" name="ex">
</map>

というようにスポットエリアを利用して、
そのエリアにカーソルを合わせた時に、
カーソルの形を変えるというような指示はできないでしょうか。。。

style="cursol:xxxx";
を利用するのかと思ったのですが、
できなかったので、、、、。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (1件)

ベストアンサー優先
最新から表示
回答順に表示

No.1ベストアンサー

回答者： Splatter
回答日時：2009/02/19 17:11

即興ですがサンプルを作成してみました。

---------------------------------------------------------
<html>
<head>
<script langage="javascript">

</script>
</head>
<body>
<img src="Sunset.jpg" id="image" width="800" height="600"
border="0" usemap="#sunset">
<map name="sunset">
<area shape="rect" coords="300,200,500,400"
onmouseover="cursorMove()" onmouseout="cursorDefault()">
<area shape="default" nohref>
</map>
</body>
</html>
---------------------------------------------------------
以降、説明です。

このサンプルではJavascriptを使用しています。
画像は800×600のSunset.jpgを使用しています。
この画像はWindowsXPのマイピクチャにデフォルトで置いてある
画像ですが、なければ別の画像と置き換えて下さい。

imageタグにはid属性に"image"をセットしています。
usemapに"#sunset"と指定し、mapタグのnameを"sunset"にします。
今回はareaタグで、画像の中心部に200×200の領域を
作成しています。

この領域に対してマウスが乗ったとき、出たときの動作として、
onmouseover、onmouseoutにJavascriptのファンクションを
指定しています。

Javascriptのファンクションでは、まずidが"image"の
オブジェクト(ここではイメージタグを指します)を取得し、
これに対してマウスカーソルの変更をしています。
cursorMode()ではマウスカーソルを移動カーソルに、
cursorDefault()ではマウスカーソルを標準に変更します。

参考になれば。