{"id":1451,"date":"2018-08-09T18:57:21","date_gmt":"2018-08-09T09:57:21","guid":{"rendered":"http:\/\/4koma-web.com\/coding\/?p=1451"},"modified":"2018-08-09T18:58:18","modified_gmt":"2018-08-09T09:58:18","slug":"%e6%a4%9c%e7%b4%a2%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%81%ab%e3%83%95%e3%82%a9%e3%83%bc%e3%82%ab%e3%82%b9%e3%81%97%e3%81%9f%e6%99%82%e3%80%81%e3%83%a1%e3%83%8b%e3%83%a5%e3%83%bc%e3%82%92%e8%a1%a8","status":"publish","type":"post","link":"https:\/\/4koma-web.com\/coding\/%e6%a4%9c%e7%b4%a2%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%81%ab%e3%83%95%e3%82%a9%e3%83%bc%e3%82%ab%e3%82%b9%e3%81%97%e3%81%9f%e6%99%82%e3%80%81%e3%83%a1%e3%83%8b%e3%83%a5%e3%83%bc%e3%82%92%e8%a1%a8\/","title":{"rendered":"\u691c\u7d22\u30d5\u30a9\u30fc\u30e0\u306b\u30d5\u30a9\u30fc\u30ab\u30b9\u3057\u305f\u6642\u3001\u30ea\u30f3\u30af\u3092\u30af\u30ea\u30c3\u30af\u3067\u304d\u308b\u30e1\u30cb\u30e5\u30fc\u3092\u8868\u793a"},"content":{"rendered":"<p>\u691c\u7d22\u30d5\u30a9\u30fc\u30e0\u306b\u30d5\u30a9\u30fc\u30ab\u30b9\u3057\u305f\u3068\u304d\u306b\u3001\u4eba\u6c17\u30ad\u30fc\u30ef\u30fc\u30c9\u306a\u3069\u8868\u793a\u3055\u305b\u308b\u30e1\u30cb\u30e5\u30fc\u306e\u4f5c\u308a\u65b9\u3067\u3059\u3002<\/p>\n<p>\u691c\u7d22\u30d5\u30a9\u30fc\u30e0\u306e\u30d5\u30a9\u30fc\u30ab\u30b9\u304c\u5916\u308c\u305f\u6642\u306e\u52d5\u4f5c\u306f\u30e1\u30cb\u30e5\u30fc\u5185\u306e\u30ea\u30f3\u30af\u4ee5\u5916\u306a\u3069\u3092\u30af\u30ea\u30c3\u30af\u3057\u305f\u5834\u5408\u306b\u30e1\u30cb\u30e5\u30fc\u3092\u9589\u3058\u308b\u3088\u3046\u306b\u8a2d\u5b9a\u3057\u3066\u3042\u308a\u307e\u3059\u3002<\/p>\n<pre>\r\n<div class=\"search-area\">\r\n<input type=\"text\" id=\"SearchInput\" placeholder=\"\u30d5\u30ea\u30fc\u30ef\u30fc\u30c9\u691c\u7d22\">\r\n<input type=\"submit\" name=\"submit\" value=\"\u691c\u7d22\" id=\"SearchButton\">\r\n\r\n<!--\u30d5\u30a9\u30fc\u30e0\u306b\u30d5\u30a9\u30fc\u30ab\u30b9\u3057\u305f\u6642\u306b\u8868\u793a\u3055\u308c\u308b\u30e1\u30cb\u30e5\u30fc-->\r\n <figure class=\"keyword\" style=\"display: block;\">\r\n   <figcaption>\u4eba\u6c17\u30ad\u30fc\u30ef\u30fc\u30c9<\/figcaption>\r\n      <ul class=\"clear\">\r\n         <li><a href=\"#\">\u30fb\u4eba\u6c17\u30ad\u30fc\u30ef\u30fc\u30c9<\/a><\/li>\r\n         <li><a href=\"#\">\u30fb\u4eba\u6c17\u30ad\u30fc\u30ef\u30fc\u30c9<\/a><\/li>\r\n         <li><a href=\"#\">\u30fb\u4eba\u6c17\u30ad\u30fc\u30ef\u30fc\u30c9<\/a><\/li>\r\n      <\/ul>\r\n  <\/figure>\r\n<\/ul>\r\n<\/pre>\n<p>\u25a0CSS<\/p>\n<pre>\r\n.search-area {\r\n    position: relative;\r\n}\r\ninput#SearchInput {\r\n    width: 420px;\r\n    height: 36px;\r\n    box-sizing: border-box;\r\n    border-radius: 5px;\r\n    padding-right: 4em;\r\n    padding-left: 3px;\r\n}\r\n#SearchButton {\r\n    position: absolute;\r\n    right: 12px;\r\n    top: 0;\r\n    bottom: 0;\r\n    background-position: center;\r\n    width: 24px;\r\n    height: 24px;\r\n    display: block;\r\n    margin: auto;\r\n    padding: 0 !important;\r\n}\r\n<\/pre>\n<p>\u25a0jQuery<\/p>\n<pre>\r\n<script>\r\n$(function(){\r\n\u3000\u3000$('input#SearchInput').focus(function(){\r\n             $('.keyword').show();\r\n       })\r\n$(\".keyword,.keyword *\").click(function(e){\r\n e.stopPropagation();\r\n});\r\n       $(\"html, body, body *\").click(function(e){\r\n\t if($(this).attr(\"id\") === \"SearchInput\"){\r\n\t   e.stopPropagation();\r\n\t }\r\n\t if(!$(this).hasClass(\"search-area\") && !$(this).hasClass(\"keyword\") && !$(this).is(\".keyword *\") && $(this).attr(\"id\") !== \"SearchInput\"){\r\n\t   $('.keyword').hide();\r\n         }\r\n       });\r\n});\r\n<\/script>\r\n<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>\u691c\u7d22\u30d5\u30a9\u30fc\u30e0\u306b\u30d5\u30a9\u30fc\u30ab\u30b9\u3057\u305f\u3068\u304d\u306b\u3001\u4eba\u6c17\u30ad\u30fc\u30ef\u30fc\u30c9\u306a\u3069\u8868\u793a\u3055\u305b\u308b\u30e1\u30cb\u30e5\u30fc\u306e\u4f5c\u308a\u65b9\u3067\u3059\u3002 \u691c\u7d22\u30d5\u30a9\u30fc\u30e0\u306e\u30d5\u30a9\u30fc\u30ab\u30b9\u304c\u5916\u308c\u305f\u6642\u306e\u52d5\u4f5c\u306f\u30e1\u30cb\u30e5\u30fc\u5185\u306e\u30ea\u30f3\u30af\u4ee5\u5916\u306a\u3069\u3092\u30af\u30ea\u30c3\u30af\u3057\u305f\u5834\u5408\u306b\u30e1\u30cb\u30e5\u30fc\u3092\u9589\u3058\u308b\u3088\u3046\u306b\u8a2d\u5b9a\u3057\u3066\u3042\u308a\u307e\u3059\u3002 \u4eba [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_locale":"","_original_post":"","footnotes":""},"categories":[1],"tags":[],"publishpress_future_action":{"enabled":false,"date":"2026-04-11 21:10:56","action":"change-status","newStatus":"draft","terms":[],"taxonomy":"category"},"_links":{"self":[{"href":"https:\/\/4koma-web.com\/coding\/wp-json\/wp\/v2\/posts\/1451"}],"collection":[{"href":"https:\/\/4koma-web.com\/coding\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/4koma-web.com\/coding\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/4koma-web.com\/coding\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/4koma-web.com\/coding\/wp-json\/wp\/v2\/comments?post=1451"}],"version-history":[{"count":0,"href":"https:\/\/4koma-web.com\/coding\/wp-json\/wp\/v2\/posts\/1451\/revisions"}],"wp:attachment":[{"href":"https:\/\/4koma-web.com\/coding\/wp-json\/wp\/v2\/media?parent=1451"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/4koma-web.com\/coding\/wp-json\/wp\/v2\/categories?post=1451"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/4koma-web.com\/coding\/wp-json\/wp\/v2\/tags?post=1451"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}