合体１■マウスのスライドショー

●2016/03/03：即時関数で囲んで、グローバル変数を消しました。
マウスストーカーに付いてくる、画像のスライドショーです。
小さな画像をスライドさせた、ブラックお笑い系です。スライド速度を２秒に設定しました。
この速度を非常に短くすると、GIFアニメ風になります。

速度を0.3秒に設定したキラキラのマウスストーカーが、■合体１-１■Ms+Sl■マウスのスライドGIFアニメ風■。
ただし前回掲載分とは違って、こちらの「GIFアニメ風」は、別のマウスストーカーのJavaScriptとの合体なので、動作は少し違います。

■合体元JavaScriptはこちら→　マウスストーカー１■画像■画像１個で１個＋簡単１■自動スライド超簡単

<!DOCTYPE html>
<html lang="ja">
<head>
<meta http-equiv="Content-type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>合体１■マウスのスライドショー</title>

<style type="text/css"><!--
body{background:#adf;}/*★背景色指定、水色。不要なら削除*/
--></style>

</head>
<body>

<!--★ここからコピー-->
<script type="text/javascript"><!--
/*==========================================================================
画像１個のマウスストーカーの参考サイト : http://www5e.biglobe.ne.jp/~purest/javascript/index.html
★マウスの画像に簡単スライドショーを合体　　2016/03/03
===========================================================================*/
(function (){ var i=0;  //即時関数で囲んでグローバル変数を消すため、この行はこのままで

//★画像指定。増減可能。画像を順番に"●",と区切って、いくつでも並べる。最後の ] の前には ,(カンマ) 無し
var mga=["wan14.gif","wan15.gif","wan16.gif","wan14c.png"];
var myurl="";  	　　　　//★画像パス。文書とは別のフォルダーなどに入っている時は指定。同じ時は"";で
var spd=2000;           //★切替速度 1000=1秒
var hx=30;              //★表示位置 x座標。マウスと画像の横位置。マイナス値で左側
var hy=30;              //★表示位置 y座標。マウスと画像の縦位置。マイナス値で上側

var load=new Array();   //画像先読み込み。切替をスムーズにする
for (var p=0,len=mga.length; p<len; p++){load[p]=new Image();load[p].src=myurl+mga[p];}
document.onmousemove=function (e){ Mo.style.left=e.pageX+hx+"px";Mo.style.top=e.pageY+hy+"px";}
function mShow(){ Mo.src=myurl+mga[i%len]; i++; setTimeout(mShow,spd);}
document.write("<img src="+myurl+mga+" id='Mo' style='position:absolute;'>");
mShow();
}());//即時関数終了
// --></script>
<!--★ここまでコピー-->

</body>
</html>

合体１■Ms+Sl■ マウスのスライドショー 最終修正日 : 2016/03/03

　合体１■Ms+Sl■　マウスのスライドショー　　　　最終修正日 : 2016/03/03