{"id":2547,"date":"2015-10-25T10:00:54","date_gmt":"2015-10-25T01:00:54","guid":{"rendered":"http:\/\/www.dream-net.org\/blog\/?p=2547"},"modified":"2015-09-20T10:46:39","modified_gmt":"2015-09-20T01:46:39","slug":"%e3%83%95%e3%83%aa%e3%83%83%e3%82%af%e6%93%8d%e4%bd%9c%e5%af%be%e5%bf%9c%ef%bc%81%e3%82%a6%e3%82%a9%e3%83%bc%e3%83%ab%e3%82%84%e3%82%b9%e3%83%a9%e3%82%a4%e3%83%80%e3%83%bc%e3%81%8c%e7%84%a1%e9%99%90","status":"publish","type":"post","link":"https:\/\/dream-net.org\/blog\/?p=2547","title":{"rendered":"\u30d5\u30ea\u30c3\u30af\u64cd\u4f5c\u5bfe\u5fdc\uff01\u30a6\u30a9\u30fc\u30eb\u3084\u30b9\u30e9\u30a4\u30c0\u30fc\u304c\u7121\u9650\u30b9\u30af\u30ed\u30fc\u30eb\u3059\u308b\u300ceco-Scroll.js\u300d"},"content":{"rendered":"<div id=\"toc_container\" class=\"no_bullets\"><p class=\"toc_title\">Contents<\/p><ul class=\"toc_list\"><li><a href=\"#eco-Scrolljs\"><span class=\"toc_number toc_depth_1\">1<\/span> \u30d5\u30ea\u30c3\u30af\u64cd\u4f5c\u5bfe\u5fdc\uff01\u30a6\u30a9\u30fc\u30eb\u3084\u30b9\u30e9\u30a4\u30c0\u30fc\u304c\u7121\u9650\u30b9\u30af\u30ed\u30fc\u30eb\u3059\u308b\u300ceco-Scroll.js\u300d<\/a><\/li><li><a href=\"#i\"><span class=\"toc_number toc_depth_1\">2<\/span> \u2460\u753b\u50cf\u306e\u6e96\u5099<\/a><\/li><li><a href=\"#i-2\"><span class=\"toc_number toc_depth_1\">3<\/span> \u2461\u30b9\u30af\u30ea\u30d7\u30c8\u306e\u8aad\u307f\u8fbc\u307f<\/a><\/li><li><a href=\"#HTML\"><span class=\"toc_number toc_depth_1\">4<\/span> \u2462HTML<\/a><\/li><li><a href=\"#i-3\"><span class=\"toc_number toc_depth_1\">5<\/span> \u2463\u30b9\u30af\u30ea\u30d7\u30c8<\/a><ul><li><a href=\"#i-4\"><span class=\"toc_number toc_depth_2\">5.1<\/span> \u25a0\u30a6\u30a9\u30fc\u30eb\u306e\u5834\u5408<\/a><\/li><li><a href=\"#i-5\"><span class=\"toc_number toc_depth_2\">5.2<\/span> \u25a0\u30d5\u30ea\u30c3\u30af\u30b9\u30af\u30ed\u30fc\u30eb\u306e\u5834\u5408<\/a><\/li><li><a href=\"#i-6\"><span class=\"toc_number toc_depth_2\">5.3<\/span> \u25a0\u30aa\u30d7\u30b7\u30e7\u30f3<\/a><\/li><\/ul><\/li><\/ul><\/div>\n<h2 style=\"color: #134985; background: #fffd73;\"><span id=\"eco-Scrolljs\">\u30d5\u30ea\u30c3\u30af\u64cd\u4f5c\u5bfe\u5fdc\uff01\u30a6\u30a9\u30fc\u30eb\u3084\u30b9\u30e9\u30a4\u30c0\u30fc\u304c\u7121\u9650\u30b9\u30af\u30ed\u30fc\u30eb\u3059\u308b\u300ceco-Scroll.js\u300d<\/span><\/h2>\n<p style=\"margin-bottom: 40px;\">\u753b\u50cf\u3084\u52d5\u753b\u3001\u30c6\u30ad\u30b9\u30c8\u3092\u7121\u9650\u30b9\u30af\u30ed\u30fc\u30eb\u3055\u305b\u3066\u304f\u308c\u308bjQuery\u306e\u30d7\u30e9\u30b0\u30a4\u30f3\u300ceco Scroll\u300d\u3002\u30d5\u30ea\u30c3\u30af\u64cd\u4f5c\u306b\u3082\u5bfe\u5fdc\u3057\u3001\u8efd\u5feb\u306a\u52d5\u304d\u306e\u30a6\u30a9\u30fc\u30eb\u3084\u30ab\u30eb\u30fc\u30bb\u30eb\u3001\u30b9\u30e9\u30a4\u30c0\u30fc\u3092\u5b9f\u73fe\u3067\u304d\u307e\u3059\u3002<br \/>\n\u4eca\u56de\u306f\u3053\u306e\u30b9\u30af\u30ea\u30d7\u30c8\u306e\u4f7f\u3044\u65b9\u3092\u3054\u7d39\u4ecb\u3057\u307e\u3059\u3002<\/p>\n<p><a href=\"http:\/\/www.juntamng.com\/eco-Scroll\" target=\"_blank\"><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.dream-net.org\/blog\/wp-content\/uploads\/2015\/09\/017.jpg\" width=\"600\" height=\"349\" \/><\/a><\/p>\n<p><a href=\"http:\/\/www.juntamng.com\/eco-Scroll\" target=\"_blank\">\u300ceco-Scroll.js\u300d<\/a><\/p>\n<p>\u25a0\u4f7f\u3044\u65b9<\/p>\n<h2 style=\"color:#134985; margin-top:70px\"><span id=\"i\">\u2460\u753b\u50cf\u306e\u6e96\u5099<\/span><\/h2>\n<p>\u30b9\u30af\u30ea\u30d7\u30c8\u304b\u3089img\u3092\u8aad\u307f\u8fbc\u3080\u306e\u3067\u3001img\u30d5\u30a9\u30eb\u30c0\u306b\u9023\u756a\u3092\u4ed8\u3051\u305f\u753b\u50cf\u3092\u7f6e\u3044\u3066\u304a\u304d\u307e\u3059\u3002<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.dream-net.org\/blog\/wp-content\/uploads\/2015\/09\/026.jpg\" width=\"472\" height=\"477\" \/><\/p>\n<p>\u30c7\u30e2\u3067\u306f\u3001\u4e0a\u306e\u3088\u3046\u306b\u3001img1.jpg\u301cimg24.jpg\u304c\u7528\u610f\u3055\u308c\u3066\u3044\u307e\u3059\u3002<\/p>\n<h2 style=\"color:#134985; margin-top:70px\"><span id=\"i-2\">\u2461\u30b9\u30af\u30ea\u30d7\u30c8\u306e\u8aad\u307f\u8fbc\u307f<\/span><\/h2>\n<p>  &lt;head&gt;\u5185\u3067jQuery\u3068eco-scroll.js\u3092\u8aad\u307f\u8fbc\u307f\u307e\u3059\u3002<\/p>\n<p style=\"margin-bottom:20px; margin-top:40px; color:#C01414\"><strong>[JavaScript]<\/strong><\/p>\n<div style=\"margin:10px 0px 30px 0px;  border:dotted #F77 1px; background: #FFF2F2; padding:20px; width:500px; color: #C01414\" >\n  &lt;head&gt;<br \/>\n  &lt;script src=&quot;http:\/\/code.jquery.com\/jquery-1.9.1.js&quot;&gt;&lt;\/script&gt;<br \/>\n  &lt;script src=&quot;js\/jquery.eco-scroll.js&quot;&gt;&lt;\/script&gt;<br \/>\n  &lt;\/head&gt;\n  <\/div>\n<h2 style=\"color:#134985; margin-top:70px\"><span id=\"HTML\">\u2462HTML<\/span><\/h2>\n<p>\u7a7a\u306ewrapper\u30af\u30e9\u30b9\u3092\u7f6e\u304d\u3001\u4e00\u610f\u306eid\u3067\u56f2\u307f\u307e\u3059\u3002<\/p>\n<p style=\"margin-bottom:20px; margin-top:40px; color:#960\"><strong>[HTML]<\/strong><\/p>\n<div style=\"margin:10px 0px 30px 0px;  border:dotted #960 1px; background: #FDF9E8; padding:20px; width:500px; color: #960\" >\n<p>&lt;div id=&quot;\u4efb\u610f\u306eid\u540d&quot;&gt;<br \/>\n&lt;div class=&quot;wrapper&quot;&gt;<br \/>\n&lt;\/div&gt;<br \/>\n&lt;\/div&gt;<\/p>\n<\/div>\n<h2 style=\"color:#134985; margin-top:70px\"><span id=\"i-3\">\u2463\u30b9\u30af\u30ea\u30d7\u30c8<\/span><\/h2>\n<p>\u5e45\u3084\u9ad8\u3055\u306a\u3069\u306e\u30aa\u30d7\u30b7\u30e7\u30f3\u3092\u8a2d\u5b9a\u3057\u3001\u5b9f\u884c\u306e\u30b3\u30fc\u30c9\u3092\u8a18\u8ff0\u3057\u307e\u3059\u3002<\/p>\n<h3 style=\"color:#134985; margin-top:40px\"><span id=\"i-4\">\u25a0\u30a6\u30a9\u30fc\u30eb\u306e\u5834\u5408<\/span><\/h3>\n<p>\u57fa\u672c\u306e\u30a6\u30a9\u30fc\u30eb\u3067\u3059\u3002\u4e0a\u4e0b\u5de6\u53f3\u3042\u3089\u3086\u308b\u65b9\u5411\u306b\u52d5\u304d\u3001\u7121\u9650\u30b9\u30af\u30ed\u30fc\u30eb\u3057\u307e\u3059\u3002<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.dream-net.org\/blog\/wp-content\/uploads\/2015\/09\/035.jpg\" width=\"600\" height=\"425\" \/><\/p>\n<p style=\"margin-bottom:20px; margin-top:40px; color:#C01414\"><strong>[JavaScript]<\/strong><\/p>\n<div style=\"margin:10px 0px 30px 0px;  border:dotted #F77 1px; background: #FFF2F2; padding:20px; width:500px; color: #C01414\" >\n  $(&quot;#divImgWall&quot;).ecoScroll({<br \/>\n  itemWidth: 150,<br \/>\n  itemHeight: 150,<br \/>\n  onShow:function(oParam) <br \/>\n  {<br \/>\n  if (oParam.bNew) <br \/>\n  {<br \/>\n  oParam.$e.append(&quot;&lt;img src=&#8217;img\/img&quot; + Math.abs( (oParam.x + oParam.y*10)%25 ) + &quot;.jpg&#8217; \/&gt;&quot;).css({opacity:0}).animate({opacity: 1}, 400);<br \/>\n  }<br \/>\n  }<br \/>\n  });<\/p>\n<\/p><\/div>\n<h3 style=\"color:#134985; margin-top:40px\"><span id=\"i-5\">\u25a0\u30d5\u30ea\u30c3\u30af\u30b9\u30af\u30ed\u30fc\u30eb\u306e\u5834\u5408<\/span><\/h3>\n<p>\u30d5\u30ea\u30c3\u30af\u306e\u611f\u89e6\u304c\u8efd\u304f\u3001\u30b5\u30af\u30b5\u30af\u3068\u52d5\u304d\u307e\u3059\u3002<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.dream-net.org\/blog\/wp-content\/uploads\/2015\/09\/045.jpg\" width=\"350\" height=\"567\" \/><\/p>\n<p style=\"margin-bottom:20px; margin-top:40px; color:#C01414\"><strong>[JavaScript]<\/strong><\/p>\n<div style=\"margin:10px 0px 30px 0px;  border:dotted #F77 1px; background: #FFF2F2; padding:20px; width:500px; color: #C01414\" >\n<p>var arrName = [<br \/>\n  &quot;\u3042\u3044\u3046\u3048\u304a&quot;, &quot;\u304b\u304d\u304f\u3051\u3053&quot;, \u3000\u3000\u3000\/\/\u4e26\u3079\u305f\u3044\u5185\u5bb9\u3092\u3053\u3053\u306b\u8a18\u8ff0<br \/>\n      ];<\/p>\n<p> $(&quot;#diviPhone&quot;).ecoScroll({<br \/>\n      itemWidth: 200,<br \/>\n      itemHeight: 30,<br \/>\n      rangeX : [0,0],<br \/>\n      rangeY : [0,100],<br \/>\n      axis : &quot;y&quot;,<br \/>\n      momentum: true,<br \/>\n      momentumSpeed: 8,<br \/>\n      onShow:function(oParam) <br \/>\n      {<br \/>\n      if (oParam.bNew &amp;&amp; oParam.x==0) <br \/>\n      {<br \/>\n      oParam.$e.append(&quot;&lt;div class=&#8217;iPhoneName&#8217;&gt;&quot;+arrName[oParam.y]+&quot;&lt;\/div&gt;&quot;);<br \/>\n      }<br \/>\n      }<br \/>\n      });<\/p>\n<\/p><\/div>\n<h3 style=\"color:#134985; margin-top:40px\"><span id=\"i-6\">\u25a0\u30aa\u30d7\u30b7\u30e7\u30f3<\/span><\/h3>\n<p><strong>momentum: true,<\/strong><br \/>\n\u6307\u3084\u30de\u30a6\u30b9\u3092\u96e2\u3057\u305f\u3068\u304d\u306b\u3001\u60f0\u6027\u3067\u52d5\u304d\u307e\u3059\u3002<\/p>\n<p><strong>momentumSpeed: 8,<\/strong><br \/>\n\u60f0\u6027\u3067\u52d5\u304f\u30b9\u30d4\u30fc\u30c9\u3092\u8abf\u7bc0\u3057\u307e\u3059\u3002 <\/p>\n<p><strong>snap:true,<\/strong><br \/>\n\u30a8\u30ec\u30e1\u30f3\u30c8\u304c\u5438\u7740\u3057\u3001\u30d4\u30c3\u30bf\u30ea\u306e\u4f4d\u7f6e\u3067\u6b62\u307e\u308a\u307e\u3059\u3002\n<\/p>\n<p style=\"margin-top: 70px;\">\u4e0a\u3067\u7d39\u4ecb\u3057\u305f\u306e\u306f\u4e00\u4f8b\u3067\u3059\u3002\u4ed6\u306b\u3082\u3001\u30ab\u30eb\u30fc\u30bb\u30eb\u3084\u30b9\u30e9\u30a4\u30c0\u30fc\u3001YouTube\u52d5\u753b\u306e\u30b9\u30af\u30ed\u30fc\u30eb\u306a\u3069\u3001\u8907\u6570\u306e\u30c7\u30e2\u304c\u7528\u610f\u3055\u308c\u3066\u3044\u307e\u3059\u3002<br \/>\n  \u30b9\u30de\u30fc\u30c8\u30d5\u30a9\u30f3\u5bfe\u5fdc\u306e\u30b5\u30a4\u30c8\u5236\u4f5c\u306b\u3001\u8a66\u3057\u3066\u307f\u3066\u306f\u3044\u304b\u304c\u3067\u3057\u3087\u3046\u304b\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Contents1 \u30d5\u30ea\u30c3\u30af\u64cd\u4f5c\u5bfe\u5fdc\uff01\u30a6\u30a9\u30fc\u30eb\u3084\u30b9\u30e9\u30a4\u30c0\u30fc\u304c\u7121\u9650\u30b9\u30af\u30ed\u30fc\u30eb\u3059\u308b\u300ceco-Scroll.js\u300d2 \u2460\u753b\u50cf\u306e\u6e96\u50993 \u2461\u30b9\u30af\u30ea\u30d7\u30c8\u306e\u8aad\u307f\u8fbc\u307f4 \u2462HTML5 \u2463\u30b9\u30af\u30ea\u30d7\u30c85.1 \u25a0\u30a6\u30a9\u30fc\u30eb\u306e\u5834\u54085.2 \u25a0\u30d5\u30ea\u30c3 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":2545,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[49,45],"tags":[],"class_list":["post-2547","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-jquery","category-web"],"_links":{"self":[{"href":"https:\/\/dream-net.org\/blog\/index.php?rest_route=\/wp\/v2\/posts\/2547","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dream-net.org\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dream-net.org\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dream-net.org\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dream-net.org\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2547"}],"version-history":[{"count":3,"href":"https:\/\/dream-net.org\/blog\/index.php?rest_route=\/wp\/v2\/posts\/2547\/revisions"}],"predecessor-version":[{"id":2550,"href":"https:\/\/dream-net.org\/blog\/index.php?rest_route=\/wp\/v2\/posts\/2547\/revisions\/2550"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dream-net.org\/blog\/index.php?rest_route=\/wp\/v2\/media\/2545"}],"wp:attachment":[{"href":"https:\/\/dream-net.org\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2547"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dream-net.org\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2547"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dream-net.org\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2547"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}