{"id":61,"date":"2015-06-01T11:01:22","date_gmt":"2015-06-01T02:01:22","guid":{"rendered":"http:\/\/www.takaya-com.jp\/archives\/?p=61"},"modified":"2015-06-01T11:01:22","modified_gmt":"2015-06-01T02:01:22","slug":"vortex","status":"publish","type":"post","link":"https:\/\/takaya-com.jp\/archives\/2015\/06\/vortex\/","title":{"rendered":"HTML\u306e\u5404\u7a2e\u8981\u7d20\u3092\u7acb\u4f53\u7684\u306b\u56de\u8ee2\u3055\u305b\u308bjQuery -vortex-"},"content":{"rendered":"


\nHTML\u306e\u5404\u7a2e\u8981\u7d20\u3092\u7acb\u4f53\u7684\u306b\u56de\u8ee2\u3055\u305b\u308bjQuery\u3001
\njquery-vortex<\/b>\u3092\u7d39\u4ecb\u3057\u307e\u3059\u3002
\n
\n\u2193\u4ee5\u4e0b\u304c\u5b9f\u969b\u306e\u30bd\u30fc\u30b9\u30b5\u30f3\u30d7\u30eb\u3067\u3059\u3002<\/p>\n

\u25bcJavaScript<\/p>\n

<script src=\".\/js\/jquery.min.js\"><\/script>\r\n<script src='.\/js\/jquery.vortex.js'><\/script>\r\n<script>\r\n$(window).load(function() {\r\n  $('#vortex').vortex({\r\n    initialPosition: 270,\r\n    speed: 500\r\n  });\r\n});\r\n<\/script><\/pre>\n
\u25bcHTML<\/p>\n
<h1>Vortex \u306e\u30ea\u30f3\u30af\u30b5\u30f3\u30d7\u30eb\u3067\u3059\u3002<\/h1>\r\n<p>\u305d\u308c\u305e\u308c\u306e\u5186\u3092\u30ea\u30f3\u30af\u306b\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\r\n<div id=\"vortex\">\r\n\t<div class=\"link_box\" id=\"red\"><a href=\"#\">1<\/a><\/div>\r\n\t<div class=\"link_box\" id=\"blue\"><a href=\"#\">2<\/a><\/div>\r\n\t<div class=\"link_box\" id=\"yellow\"><a href=\"#\">3<\/a><\/div>\r\n\t<div class=\"link_box\" id=\"green\"><a href=\"#\">4<\/a><\/div>\r\n\t<div class=\"link_box\" id=\"orange\"><a href=\"#\">5<\/a><\/div>\r\n<\/div><\/pre>\n
\u25bcCSS<\/p>\n
#vortex {\r\n  width: 600px;\r\n  height: 300px;\r\n  position: relative;\r\n\tmargin:100px 300px;\r\n}\r\n.link_box {\r\n  width: 50px;\r\n  height: 50px;\r\n  border: solid 2px black;\r\n  border-radius: 50px;\r\n\ttext-align:center;\r\n  position:relative;\r\n}\r\n.link_box a {\r\n\t  position:absolute;\r\n    top:0;\r\n    left:0;\r\n    width:100%;\r\n    height:100%;\r\n    text-indent:-999px;\r\n}\r\n#red{\r\n\tbackground-color:red;\r\n}\r\n#blue{\r\n\tbackground-color:blue;\r\n}\r\n#yellow{\r\n\tbackground-color:yellow;\r\n}\r\n#green{\r\n\tbackground-color:green;\r\n}\r\n#orange{\r\n\tbackground-color:orange;\r\n}<\/pre>\n
\u4eca\u56de\u3001\u53c2\u8003\u306b\u3055\u305b\u3066\u3044\u305f\u3060\u3044\u305f\u306e\u306f\u3001
\n\u300emonteiz\/jquery-vortex\u3000-github-<\/a>\u300f\u3055\u3093\u3067\u3059\u3002
\n\u3042\u308a\u304c\u3068\u3046\u3054\u3056\u3044\u307e\u3059\u3002<\/p>\n
\u30c7\u30e2\u30da\u30fc\u30b8\u306f\u3001\u3053\u3061\u3089<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
HTML\u306e\u5404\u7a2e\u8981\u7d20\u3092\u7acb\u4f53\u7684\u306b\u56de\u8ee2\u3055\u305b\u308bjQuery\u3001 jquery-vortex\u3092\u7d39\u4ecb\u3057\u307e\u3059\u3002<\/p>\n","protected":false},"author":3,"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\/61"}],"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\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/comments?post=61"}],"version-history":[{"count":2,"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/posts\/61\/revisions"}],"predecessor-version":[{"id":74,"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/posts\/61\/revisions\/74"}],"wp:attachment":[{"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/media?parent=61"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/categories?post=61"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/takaya-com.jp\/archives\/wp-json\/wp\/v2\/tags?post=61"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}