マウスポインタをある形に変えたい

解決済

質問者：aoppy-san
質問日時：2009/09/13 00:32
回答数：4件

ちょっとかじっただけの初心者です。（技術者向けのカテゴリーですいません）

スタイルシートでマウスポインタを

画面全体を横切る十字（つまり、クリックするところが縦線と横線のクロス点になっている、線は画面全体にわたっている）

といった形にしたいのですが、どうすればよいでしょうか。
以前、どこかのＨＰで見たことがあるのですが、どこか忘れてしまったのでソースの確認もできず、検索してもマウスポインタを特定の画像にかえる方法しか見つけられず困っています。
それを応用できるだけの知識もないので、詳しい方、なにかご教授お願いします。

通報する

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

質問の本文を隠す

回答 (4件)

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

No.4ベストアンサー

回答者： reverie013
回答日時：2009/09/14 11:23

全くの初心者時代にお世話になっていたサイトにそういうものがありましたので一応リンク貼っておきます。

http://l-c.moo.jp/top.htm
love cherry＞ENTER＞TAG＞ストーカー＞集中線

- 0
- 件

通報する

この回答へのお礼

おおおお！なんてシンプル！さっそく試してみます。
というかこのサイトちょっといいですね。ブックマークしておきます。
ありがとうございました！

通報する

お礼日時：2009/09/15 15:33

No.3

回答者： noname#100277
回答日時：2009/09/13 19:14

http://www.hajimeteno.ne.jp/dhtml/sample/sp63.html
http://www.awcs.org/dhtml/sample/crossmousered.h …
http://zumirin.cool.ne.jp/kowaza/point.htm
ですね？
CSS＋javascriptです。
一個目はFirefoxも表示可能。

- 0
- 件

通報する

この回答へのお礼

参考のページをいきつも紹介してくださってありがとうございます！
そうですか、javascriptもかんでるんですね。わかりやすいです。
参考にさせていただきます。ありがとうございます！

通報する

お礼日時：2009/09/15 15:32

No.2

回答者： N_A_O
回答日時：2009/09/13 02:41

<HTML>

<HEAD>
<style>
.hair{
position:absolute;top:0px;left:0px;
height:1px;width:1px;
layer-background-color:#f0f;background:#f0f;
font-size:1px;
}
</style>

</HEAD>
<BODY >
<script>
document.write("<div id='hy' class='hair'></div>");
document.write("<div id='hx' class='hair'></div>");
var ns=(document.layers);
var n6=(document.getElementById&&!document.all);
var ie=(document.all);
var my=0;
var mx=0;
var d=(ns||ie)?'document.':'document.getElementById("';
var a=(ns||n6)?'':'all.';
var n6r=(n6)?'")':'';
var s=(ns)?'':'.style';
var y=eval(d+a+'hy'+n6r+s);
var x=eval(d+a+'hx'+n6r+s);
(ns||n6)?window.captureEvents(Event.MOUSEMOVE):0;
function m(e){
my = (ns||n6)?e.pageY-2-window.pageYOffset:event.y-4;
mx = (ns||n6)?e.pageX-2-window.pageXOffset:event.x-4;
ani();
}
(ns)?window.onMouseMove=m:document.onmousemove=m;
function ani(){
H=(ns||n6)?window.innerHeight:document.body.clientHeight;
W=(ns||n6)?window.innerWidth:document.body.clientWidth;
Y=(ns||n6)?window.pageYOffset:document.body.scrollTop;
X=(ns||n6)?window.pageXOffset:document.body.scrollLeft;
(ns)?y.clip.height=H:(n6)?y.height='100%':y.height=H;
(ns)?y.clip.width=1:y.width=1;
(ns)?x.clip.height=1:x.height=1;
(ns)?x.clip.width=W:(n6)?x.width='100%':x.width=W;
y.top=Y;
y.left=X+mx;
x.top=my+Y;
x.left=X;
}
if (!ie)window.onresize=new Function("window.location.reload()");
if (ie)window.document.body.onscroll=ani;
</script>
</BODY>
</HTML>