{"id":559,"date":"2017-03-22T16:27:55","date_gmt":"2017-03-22T07:27:55","guid":{"rendered":"http:\/\/www.takaya-com.jp\/archives\/?p=559"},"modified":"2017-03-22T16:29:32","modified_gmt":"2017-03-22T07:29:32","slug":"spotlight","status":"publish","type":"post","link":"https:\/\/takaya-com.jp\/archives\/2017\/03\/spotlight\/","title":{"rendered":"JavaScript\u3067\u3001\u30de\u30a6\u30b9\u306b\u5408\u308f\u305b\u3066\u52d5\u304f\u30b9\u30dd\u30c3\u30c8\u30e9\u30a4\u30c8\u3092\u4f5c\u3063\u3066\u307f\u307e\u3057\u305f\u3002"},"content":{"rendered":"<p>JavaScript\u3067\u3001\u30de\u30a6\u30b9\u306b\u5408\u308f\u305b\u3066\u52d5\u304f\u30b9\u30dd\u30c3\u30c8\u30e9\u30a4\u30c8\u3092\u4f5c\u308a\u307e\u3057\u305f\u3002 \u30dc\u30bf\u30f3\u3092\u30af\u30ea\u30c3\u30af\u3059\u308b\u3068\u30b9\u30dd\u30c3\u30c8\u30e9\u30a4\u30c8\u304con\/off\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n<p>\u2193\u4ee5\u4e0b\u304c\u5b9f\u969b\u306e\u30bd\u30fc\u30b9\u30b5\u30f3\u30d7\u30eb\u3067\u3059\u3002<\/p>\n<p>\u25bcJavaScript<\/p>\n<pre title=\"JavaScript\" class=\"lang:js decode:true\">&lt;script type=\"text\/javascript\"&gt;\r\nvar iro=new Array(\"#000\",\"#050\",\"#00f\");\r\nvar chokkei=250;\r\nvar futosa=100;\r\n\r\nvar hanni=chokkei+\"px\", waku=futosa+\"px\", vis=true;\r\nvar irosettei=iro[Math.floor(Math.random()*iro.length)];\r\ndocument.onmousemove=function (e){\r\nvar chushin=chokkei\/2+futosa;\r\nSpotlight.style.left=e.pageX-chushin+\"px\"; Spotlight.style.top=e.pageY-chushin+\"px\"; \r\n}\r\nfunction onoff(){\r\nif (vis){ vis=false; sousa.value=\"\u30b9\u30dd\u30c3\u30c8\u30e9\u30a4\u30c8On\"; Spotlight.style.opacity=0; document.onmousemove=null;}\r\nelse{location.reload();}\r\n}\r\ndocument.write('&lt;div id=\"Spotlight\" style=\"position: absolute; top: -500px; left: -500px; width: '+hanni+'; height: '+hanni+'; border: solid '+waku+' '+irosettei+'; border-radius: 50%; z-index: 200;\"&gt;'); \r\ndocument.write('&lt;div id=\"wakuB\" style=\"position:absolute;top:0;left:0; width:'+hanni+';height:'+hanni+'; outline:solid 2000px '+irosettei+';\"&gt;&lt;\/div&gt;&lt;\/div&gt;');\r\n&lt;\/script&gt;\r\n<\/pre>\n<p>\u25bcCSS<\/p>\n<pre title=\"CSS\" class=\"lang:js decode:true\">&lt;style type=\"text\/css\"&gt;\r\n\r\nbody{\r\nbackgroundcolor:#fff;\r\ncolor:#000;}\r\n\r\n#Spotlight{\r\nopacity:0.9;\r\ntransition:opacity 2s ease-out;}\r\n\r\n#sousa{\r\nposition:fixed;\r\ntop:100px; left:30px;\r\nz-index:201;}\r\n\r\np {\r\ntext-align:center;}\r\n&lt;\/style&gt;\r\n<\/pre>\n<p>\u25bcHTML<\/p>\n<pre title=\"HTML\" class=\"lang:js decode:true\">&lt;input type=\"button\" value=\"\u30b9\u30dd\u30c3\u30c8\u30e9\u30a4\u30c8Off\" onclick=\"onoff();\" title=\"on\/off\" id=\"sousa\"&gt;\r\n&lt;div style=\"margin:200px 10%;background:#d03; border:solid 5px #600;padding:20px;\"&gt;\r\n&lt;p&gt;\u30b9\u30dd\u30c3\u30c8\u30e9\u30a4\u30c8on\u6642\u306e\u8272\u306f\u30e9\u30f3\u30c0\u30e0\u30673\u8272\u306b\u5909\u308f\u308a\u307e\u3059\u3002&lt;\/p&gt;\r\n&lt;\/div&gt;\r\n<\/pre>\n<p>\u4eca\u56de\u3001\u53c2\u8003\u306b\u3055\u305b\u3066\u3044\u305f\u3060\u3044\u305f\u306e\u306f\u3001\u300e\u52d5\u304fJavaScript\u300f\u3055\u3093\u306e\u30b5\u30a4\u30c8\u3067\u3059<\/p>\n<p><a href=\"http:\/\/oekakirenn.webcrow.jp\/mouse_setumei.html\" target=\"_blank\">\u300c\u52d5\u304fJavaScript\u300d\u3055\u3093\u306e\u30b5\u30a4\u30c8\u306f\u3053\u3061\u3089<\/a><\/p>\n<p><a href=\"http:\/\/www.takaya-com.jp\/archives\/demo\/spotlight\/\" target=\"_blank\">\u30c7\u30e2\u30da\u30fc\u30b8\u306f\u3001\u3053\u3061\u3089<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>JavaScript\u3067\u3001\u30de\u30a6\u30b9\u306b\u5408\u308f\u305b\u3066\u52d5\u304f\u30b9\u30dd\u30c3\u30c8\u30e9\u30a4\u30c8\u3092\u4f5c\u308a\u307e\u3057\u305f\u3002 \u30dc\u30bf\u30f3\u3092\u30af\u30ea\u30c3\u30af\u3059\u308b\u3068\u30b9\u30dd\u30c3\u30c8\u30e9\u30a4\u30c8\u304con\/off\u306b\u306a\u308a\u307e\u3059\u3002 \u2193\u4ee5\u4e0b\u304c\u5b9f\u969b\u306e\u30bd\u30fc\u30b9\u30b5\u30f3\u30d7\u30eb\u3067\u3059\u3002 \u25bcJavaScript &lt;script  [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/posts\/559"}],"collection":[{"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/comments?post=559"}],"version-history":[{"count":7,"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/posts\/559\/revisions"}],"predecessor-version":[{"id":567,"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/posts\/559\/revisions\/567"}],"wp:attachment":[{"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/media?parent=559"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/categories?post=559"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/tags?post=559"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}