マウスストーカー１３■文字■　マウスのリアル時計

●2016/06/19：即時関数で囲んで、グローバル変数を消しました。
ゆっくりとマウスの後追いする、リアル時計のマウスストーカーです。
マウスの後追いの動作の参考は、YAHOO!知恵袋から。
リアル時計の原本はMake-Mobileから。

■リアル時計を消したり付けたりする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"><!--
/*★時計文字の装飾。#Moは必須。後はお好みで*/
#Mo{
font-size:20px;/*★文字サイズ指定*/
color:#aaa;/*★文字色　灰色*/
font-family:Atilla,Arial;/*★フォント書体指定。指定したフォントで表示できない場合に備え2個指定。お好みで*/
font-weight:bold;/*★太字指定*/
background:#fde;/*★背景色指定　ピンク*/
--></style>
<!--★コピーここまで。bodyにもコピー有り-->

</head>
<body> 

<!--★コピーここから-->
<script type="text/javascript"><!--
/*===================================================================
マウスストーカーのリアル時計　　　★下記合体　2016/06/19
ゆっくり後追い移動の参考：http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q1196547876（YAHOO!知恵袋）
リアル時計表示  By  http://makemobile.6.tool.ms/121/（Make-Mobile）
====================================================================*/
(function (){  //即時関数で囲んでグローバル変数を消すため、この行はこのままで

var hx=10;         //★表示位置 x座標。マウスと時計の横位置。マイナス値で左側
var hy=30;         //★表示位置 y座標。マウスと時計の縦位置。マイナス値で上側
var spd=40;        //★原本40。マウスと時計の速度。小さいほど速い
var yure=0.3;      // ( 0～1 の小数 ) ★原本0.2。時計の揺らぎ。小さいほど大きな動き

//指定ここまで--------------------------------------------------------------------------
var newx=0,xp=0,newy=0,yp=0;
document.write("<span id='Mo' style='position:absolute;'></span>");
function tim(){
function f(n){return n<10?"0"+n:n;}
var t=new Date;
document.getElementById("Mo").innerHTML=f(t.getHours())+":"+f(t.getMinutes())+":"+f(t.getSeconds());
}
document.onmousemove=function (e){newy=e.pageY+hy; newx=e.pageX+hx;}
function Run(){
var w=window.innerWidth-Mo.offsetWidth-18;
var h=window.pageYOffset+window.innerHeight-Mo.offsetHeight-18;
xp+=Math.floor((newx-xp)*yure); Mo.style.left=Math.min(w,xp)+"px";
yp+=Math.floor((newy-yp)*yure); Mo.style.top=Math.min(h,yp)+"px";
setTimeout(Run,spd); tim();
}
Run();
}());//即時関数終了
// --></script>
<!--★コピーここまで-->

</body>
</html>

マウスストーカー１３■文字■ マウスのリアル時計 最終修正日 : 2016/06/19

　マウスストーカー１３■文字■　マウスのリアル時計　　　　最終修正日 : 2016/06/19