- ベストアンサー
HTMLタグでマウスポインタを変えたい
マウスの形を変えるHTMLってありますか？ まだHP初心者なんで、あんまわかりません 動くタイプなんですができますでしょうか・・・？ 素材はあるのです、HTMLさえわかれば・・・ってヤツです。 よろしくおねがいします
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
IE6以降に限定すればVegasさんのご紹介URLが参考になると思います。 私も参考になりました（笑） >できるならマスコット系でもオｋです。 一応サンプルをご紹介します。 私のオリジナルなので動作保障などありませんのでご了承ください。 ↓ここから・・・ <!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN"> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <html lang="ja"> <head> <title>カーソルにくっついているマスコット</title> <style type="text/css"> <!-- /* rect(0,32,32,0)で画像の基本サイズをpixelで指定する */ /* この例は、マスコット画像が32x32pixelの場合 */ #mascot { position:absolute;top:100;left:100; width:150;height:40;clip:rect(0,32,32,0) } //--> </style> <script language="javascript1.2"> <!-- spanName = "mascot"; document.onmousemove = doMouseMove; var itemOffsetX = 5;//マスコットをカーソルからどれだけ離すか（X方向） var itemOffsetY = 5;//マスコットをカーソルからどれだけ離すか（Y方向） // Netscape対応を考慮するなら // チェックボックスなどをクリックできなくなるので「0」にはしないこと NN = (document.layers) ? 1 : 0; NN6 = (document.getElementById && !document.all) ? 1 : 0; IE = (document.all) ? 1 : 0; function selectImage(image_file) { var msgHTML = '<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Shift_JIS">'; if (document.parameter.show_mascot.checked) { msgHTML += '<SPAN STYLE="font:10pt Osaka,Arial; color:#505050">'; msgHTML += "<img src='" + image_file + "'>"; msgHTML += '</SPAN>'; outputLAYER(spanName, msgHTML); } } function doMouseMove(e) { var mouseX = 0; var mouseY = 0; if (document.parameter.show_mascot.checked) { if (NN) { mouseX = e.pageX + itemOffsetX; mouseY = e.pageY + itemOffsetY; } if (NN6) { mouseX = e.pageX + itemOffsetX; mouseY = e.pageY + itemOffsetY; } if (IE) { mouseX = document.body.scrollLeft + event.clientX + itemOffsetX; mouseY = document.body.scrollTop + event.clientY + itemOffsetY; } moveLAYER(spanName, mouseX, mouseY); } else { hideLAYER(spanName); } } function outputLAYER(layName, html){ if(NN) {//NN用 document.layers[layName].document.open(); document.layers[layName].document.write(html); document.layers[layName].document.close(); } if(NN6){//NN6用 document.getElementById(layName).innerHTML = html; } if(IE){//IE用 document.all(layName).innerHTML = html; } } function moveLAYER(layName, posX, posY){ if (NN) { //NN用 document.layers[layName].moveTo(posX, posY); } if (NN6) { //NN6用 document.getElementById(layName).style.left = posX; document.getElementById(layName).style.top = posY; } if (IE) { //IE用 document.all(layName).style.pixelLeft = posX; document.all(layName).style.pixelTop = posY; } } function hideLAYER(layName){ moveLAYER(layName, -1000, -1000); } --> </script> <!-- selectImage('mascot01.jpg')の「mascot01.jpg」をマスコットのファイル名に変える --> <body onLoad="selectImage('mascot01.jpg')"> <span ID="mascot"> </span> マスコットの表示サンプル<br> <form name="parameter"> マスコットの表示：<input type="checkbox" name="show_mascot" checked=ture> </form> マウスカーソルにmascot01.jpgがくっつきます。<br> アニメーションGIFファイルなどを指定しても大丈夫だと思います。<br> 個人的には鬱陶しいので、マスコットのON/OFFはできるようにしておいて欲しいなと思います。<br> マウスがウインドウから外れたときにマスコットが置き去りになってしまう点、改良すべきです。<br> </body> </html> ↑ここまでをコピーして、index.htmlというファイルを作成してください。 画像ファイルを用意して、index.htmlを同じフォルダに保管します。 selectImage('mascot01.jpg')の「mascot01.jpg」を画像ファイル名に変更する。 以上で動くと思います。
その他の回答 (2)
- Vegas
- ベストアンサー率60% (635/1056)
■ カーソルを好きな画像で指定する http://masaboo.cside.com/new_css1/cs_36.htm 画像ファイルの拡張子に注意が必要なのと 表示されるブラウザに制限があるということを念頭に置いて下さい カーソルやポインタの形を変えるだけなら↓コチラ http://zumirin.cool.ne.jp/kowaza/cursor.htm ※個人的見解ですが、マウスポインタに追尾してくるタイプは鬱陶しい事この上ないです
- dayowl
- ベストアンサー率56% (84/148)
マウスのカーソル自体を変えるのはあまり自由度が高くありません。 こんな感じで、リンクの上にマウスカーソルがくるとカーソルの絵が変わるというものです。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <body> <a href="help.htm" style="cursor: help;">[ヘルプ]</a> </body> </html> 「cursor:help」でカーソルを指定しているわけですが 他にも「help」の代りにcrosshair、default、pointerなどを指定することもできます。 「動くタイプ」というのはマウスカーソル自体が動くという意味だと解釈すると、それはできないと思います。 但し、マウスカーソルにくっついていくマスコットのようなものならできますが、それではダメなんですよね？
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/spn/images/related_qa/c205_2_thumbnail_img_sm.png)
補足
>「動くタイプ」というのはマウスカーソル自体が動くという意味だと解釈すると、それはできないと思います。 >但し、マウスカーソルにくっついていくマスコットのようなものならできますが、それではダメなんですよね？ できるならマスコット系でもオｋです。 マウス自体はムリと考えるとソッチのほうがイイかもしれません。自分テキに