アプリ版：「スタンプのみでお礼する」機能のリリースについて

HTMLタグでマウスポインタを変えたい

解決済

  • 質問者：kokumaryu
  • 質問日時：
  • 回答数：3件

マウスの形を変えるHTMLってありますか？
まだHP初心者なんで、あんまわかりません
動くタイプなんですができますでしょうか・・・？
素材はあるのです、HTMLさえわかれば・・・ってヤツです。
よろしくおねがいします

通報する

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

質問の本文を隠す

A 回答 (3件)

No.3ベストアンサー

  • 回答者： dayowl
  • 回答日時：

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」を画像ファイル名に変更する。
以上で動くと思います。
    • good
    • 0
    • 件
通報する

No.2

  • 回答者： Vegas
  • 回答日時：

■ カーソルを好きな画像で指定する


http://masaboo.cside.com/new_css1/cs_36.htm

画像ファイルの拡張子に注意が必要なのと
表示されるブラウザに制限があるということを念頭に置いて下さい

カーソルやポインタの形を変えるだけなら↓コチラ
http://zumirin.cool.ne.jp/kowaza/cursor.htm


※個人的見解ですが、マウスポインタに追尾してくるタイプは鬱陶しい事この上ないです
    • good
    • 0
    • 件
通報する

No.1

  • 回答者： dayowl
  • 回答日時：

マウスのカーソル自体を変えるのはあまり自由度が高くありません。


こんな感じで、リンクの上にマウスカーソルがくるとカーソルの絵が変わるというものです。
<!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などを指定することもできます。

「動くタイプ」というのはマウスカーソル自体が動くという意味だと解釈すると、それはできないと思います。
但し、マウスカーソルにくっついていくマスコットのようなものならできますが、それではダメなんですよね？

この回答への補足

>「動くタイプ」というのはマウスカーソル自体が動くという意味だと解釈すると、それはできないと思います。
>但し、マウスカーソルにくっついていくマスコットのようなものならできますが、それではダメなんですよね？

できるならマスコット系でもオｋです。
マウス自体はムリと考えるとソッチのほうがイイかもしれません。自分テキに

補足日時：2004/06/05 09:26
通報する
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

関連するカテゴリからQ&Aを探す

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報