マウスに付いて来る絵
【IE5】【Ne4】
下記がソースです。必要な方は自由(確認不要)に活用して下さい。
<HTML>
<HEAD>
<TITLE>マウスに付いて来る絵</TITLE>
<STYLE type=text/css>
div {FONT-SIZE:12pt; COLOR:#ff0000; TOP:-100px; POSITION:absolute; font-weight:bold}
</STYLE>
<SCRIPT language=JavaScript>
<!--
// ******* 下記を変更の事(KIの実用JavaScript)*******
// 画像とサイズの指定
var gifdat = "<IMG src='niko1.gif' width='15' height='15' border='0'>"
var shu=8 // 画像数
var xa = 15 // 矢印からの文字の表示横位置
var ya = -5 // 矢印からの文字の表示縦位置
// ***************************************************
var haba = 0
var xiti=new Array()
var yiti=new Array()
var msg=new Array()
for (i=0;i<shu;i++) {
xiti [i] = -100
yiti [i] = -100
msg [i] = gifdat
}
var shoki = 0
function mousmv(evt){
x = (document.layers) ? evt.pageX : document.body.scrollLeft+event.clientX;
y = (document.layers) ? evt.pageY : document.body.scrollTop+event.clientY;
shoki = 1
}
function hyouzi() {
if (shoki==1 && document.all) {
for (i=shu; i>=1; i--) {
xiti[i]=xiti[i-1]+haba
yiti[i]=yiti[i-1]
}
xiti [0] = x + xa
yiti [0] = y + ya
for (i=0; i<shu; i++) {
var hyouzi1 = eval("document.all.divno" + (i) + ".style")
hyouzi1.posLeft=xiti[i]
hyouzi1.posTop=yiti[i]
}
}
if (shoki==1 && document.layers) {
for (i=shu; i>=1; i--) {
xiti[i]=xiti[i-1]+haba
yiti[i]=yiti[i-1]
}
xiti [0] = x + xa
yiti [0] = y + ya
for (i=0; i<shu; i++) {
var hyouzi1 = eval("document.divno"+i)
hyouzi1.left=xiti[i]
hyouzi1.top=yiti[i]
}
}
var Timer = setTimeout("hyouzi()", 10)
}
//-->
</SCRIPT>
</HEAD>
<BODY BGCOLOR=#F0FFF0 onload="hyouzi()">
<font color=#ff00ff><b>マウスに付いて来る絵</b></font>
<font size=2>【IE5】【Ne4】
下記がソースです。必要な方は自由(確認不要)に活用して下さい。
</font><hr>
<SCRIPT language=JavaScript>
<!--
for (i=0;i<=shu;i++) {
document.write ("<div id='divno" + i + "'>")
document.write(msg[i])
document.write ("</div>")
}
if (document.layers){
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = mousmv;
//-->
</SCRIPT>
</BODY>
</HTML>
このサンプルの外部ファイル化(jsファイル)の依頼メールがあったので回答したサンプルを
参考に掲載します。(必要な方はダウンロードして自由に使って下さい)
サンプル1
サンプル2(こちらは画像を変える例)