<p>最近ビジネスにおいて脱IT的な記事や成功れをたびたび目にする。</p>
<p>最近のもので印象に残っているのはこれ。<br />
<a href="http://dot.asahi.com/aera/2014020500043.html" target="_blank">http://dot.asahi.com/aera/2014020500043.html</a></p>
<p>・メールをさばいたり、装飾に凝った資料を作ったりすることで逆に時間が奪われ、仕事の質も下がっている<br />
・デスクは頭で考える仕事をする場、パソコン島はデスクでまとめた内容をアウトプットする作業の場<br />
・パソコン使用中には脳があまり働かない</p>
<p>と興味深い実例と意見が幾つかある。</p>
<p>上記を含めてITのデメリットとはまとめると以下の2点に集約されると思う。</p>
<p>・手軽な情報伝達により情報の重みが減っている<br />
・調べてるだけで考えてると思ってしまっている</p>
<p>前者はスピードが重要視される上ではある程度仕方がないことかとも思う。<br />
だが逆に重要な情報を絞って注力したら結果が出た、というのが成功例なのだろうと思う。<br />
例えば企業であれば、複数のお客さんの中で利益を生んでくれる上客をピックアップし、それ以外のお客との接点を減らす。<br />
減った時間を上客のために使ったほうが数字が上がった、というようなことだろう。<br />
少し話はそれるが、この問題は色々なシチュエーションで言えることだと思う。<br />
例えば就活生の進路について、情報がありすぎて決めきれず中途半端になってしまったり<br />
装飾された情報におどらされて誤った選択をしてしまうなど。<br />
要は情報の選択と精査ができるスキルを持っていない人にとってITはデメリットになるということだ。</p>
<p>後者は資料を作ったり問題を解決する時ググった情報を寄せ集めたことで完了させてしまうことだ。<br />
人からの情報はヒントにはなるが結果にはならない。<br />
これはかなりの人がやってしまっていると思う。むしろ80%以上の人が該当するのでは?と個人的に思ってしまう。<br />
我々の業界でプログラマーという職種で、ベースは専門学校などで学んでツールの使い方やプログラムの実行の仕方はしっている。<br />
後はググって出てきたソースを順番にコピペして正常に動いたら完了。<br />
というプログラマーをたまに見かけるが、こうゆう人がプログラマーとして成長する可能性は低い。<br />
どうして動く・動かないのかを考えていないからだ。<br />
本来であれば考えて実行して、動かないところのヒントを得るか、<br />
若しくはコピペで動いたとしてもその情報をくまなく読んで理解したほうが良い。</p>
<p>前置きが長かったが、本ブログは特に後者を解消し、更に資料作成と問題解決を高めてくれそうな情報を見つけたのでその紹介。</p>
<p><a href="http://p.tl/BKt6" target="_blank">http://p.tl/BKt6</a><br />
こちらの本で紹介されていたもので、通称マッキンノートと言われるものとのこと。</p>
<p>書いてあることと自分が思ったことをまとめると</p>
<p>・ネットから離れることで考えることに集中できる<br />
→ 紙を埋めることに集中することで調べるという裏ワザを遮断できる。結果としてオリジナリティと説得力が増す</p>
<p>・装飾にとらわれず成果を追求できる<br />
→ パワポなどで提出用の資料をつくろうとするのではなく、考えをまとめたり<br />
相手を説得するロジックを組み立てるといった本質に集中できるため、高い成果が期待できる<br />
尚、この本の筆者はこれは下書きなので時間がかかりそうだが実はこの方が早く、さらに何度も書き直すために鉛筆で書いたほうがいいと行っている</p>
<p><a href="/uploads-archive/2014/02/a.jpg"><img decoding="async" loading="lazy" class="aligncenter size-full wp-image-4266" alt="a" src="/uploads-archive/2014/02/a.jpg" width="556" height="441" srcset="/uploads-archive/2014/02/a.jpg 556w, /uploads-archive/2014/02/a-300x237.jpg 300w, /uploads-archive/2014/02/a-228x180.jpg 228w" sizes="(max-width: 556px) 100vw, 556px" /></a></p>
<p>1：タイトル欄<br />
2：ページメッセージ欄　→ 必ず意味合いを書き出す癖をつける<br />
3：図表の縦軸横軸を正確に書けるように升目状になっている<br />
4：注意、出所欄 → 必ず情報ソースを明記する癖をつける</p>
<p>個人的に説明資料は紙で作ってからパワポ等にしているが、<br />
戦略を考えたりする時もこのようにしたほうが良いのではと思った。<br />
考えなければ成長しないし結果も出にくいと思う。</p>


マッキンゼーノート

<div class="booklink-box" style="text-align:left;padding-bottom:20px;font-size:small;/zoom: 1;overflow: hidden;">
<div class="booklink-image" style="float:left;margin:0 15px 10px 0;"><a href="http://www.amazon.co.jp/exec/obidos/asin/4062124963/sackoh71-22/" target="_blank" ><img decoding="async" src="http://ecx.images-amazon.com/images/I/41VAQSZE03L._SL160_.jpg" style="border: none;" /></a></div>
<div class="booklink-info" style="line-height:120%;/zoom: 1;overflow: hidden;">
<div class="booklink-name" style="margin-bottom:10px;line-height:120%"><a href="http://www.amazon.co.jp/exec/obidos/asin/4062124963/sackoh71-22/" target="_blank" >魔法の発音 カタカナ英語</a></p>
<div class="booklink-powered-date" style="font-size:8pt;margin-top:5px;font-family:verdana;line-height:120%">posted with <a href="http://yomereba.com" rel="nofollow" target="_blank">ヨメレバ</a></div>
</div>
<div class="booklink-detail" style="margin-bottom:5px;">池谷 裕二 講談社 2004-10-23    </div>
<div class="booklink-link" style="margin-top: 5px"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/4062124963/sackoh71-22/" name="booklink" rel="nofollow" target="_blank">Amazon.co.jp で詳細を見る</a></div>
</div>
<div class="booklink-footer" style="clear: left"></div>
</div>
<p>脳科学者として有名な池谷裕二さんが脳科学の延長で何故日本人は英語が苦手なのか？に対する回答です。</p>
<p>他の著作も非常に面白く、守備範囲の広さに脱帽です。</p>
<p>社内で英語が飛び交うようになり、お恥ずかしながら本の紹介です。</p>
<h2>抜粋</h3>
<ul>
<li>推理の言語の日本語。同音異義語がたくさんある。</li>
<li><span style="line-height: 1.5em;">そもそも発音の数が少ない。</span></li>
</ul>
<p>この2つが日本人が英語を不得意とする理由。</p>
<p>日本語の発音の数が少ないので、もう英語のようにたくさんの発音を使い分けることは難しい。</p>
<p>逆に発音の数が少ない＝パターンが少ないため、同音で異なる意味の言葉が多いのが特徴だ。</p>
<p>それを推理しながら、的確に文脈を捉えることが出来るのは日本人独特の能力である。</p>
<p>以上のことを踏まえて、正しいカタカナ英語を覚えようというのが趣旨である。</p>
<ul>
<li>Can I have&#8230;? （～をください） は「ケナヤブ」</li>
<li>Do you have&#8230;? （～はありますか？） は「ジュヤブ」</li>
<li>Do you want to&#8230;? （～したいですか？） は「ジュワナ」</li>
<li>I want you to&#8230; （～してください） は「アイワニュル」</li>
<li>Do you mind if I&#8230;? （～してもよいですか？） は「ジュマインデファイ」</li>
<li>Can you take our picture? （シャッターを押してください？） は「ケニュテイカワペクチョ」</li>
</ul>


魔法の発音 カタカナ英語 &#8211; 池谷裕二

<p>少し前から流行っているフラットデザインですが、最近は日本のサイトでも多く見かけるようになりました。</p>
<p>勉強のために、いろいろ見てきたものをここでは７つ紹介したいと思います。</p>
<h2>フラットデザインのサイト7選</h3>
<h3>株式会社ユニオンネット</h4>
<p>大阪の制作会社さんのサイトです。<br />
横幅いっぱいの写真を使用し、ちょっとした動きもありいい感じです。</p>
<p>&nbsp;</p>
<p><a href="/uploads-archive/2014/02/d416efe8d5de2b80300be706e602d1bb.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4255" alt="ホームページ制作│大阪│株式会社ユニオンネット" src="/uploads-archive/2014/02/d416efe8d5de2b80300be706e602d1bb.jpg" width="650" height="488" srcset="/uploads-archive/2014/02/d416efe8d5de2b80300be706e602d1bb.jpg 1007w, /uploads-archive/2014/02/d416efe8d5de2b80300be706e602d1bb-300x225.jpg 300w, /uploads-archive/2014/02/d416efe8d5de2b80300be706e602d1bb-228x171.jpg 228w" sizes="(max-width: 650px) 100vw, 650px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://www.unionnet.jp/" target="_blank">ホームページ制作│大阪│株式会社ユニオンネット</a></p>
<p>&nbsp;</p>
<h3>DEMONO（デモノ）体験をモノに。</h4>
<p>ECサイトのツールを手がけている会社さんで、色合いがいい感じですね！<br />
スクロールと連動した動きもつけられています。</p>
<p><a href="/uploads-archive/2014/02/0095e64a6ea4d783f9175e6fe7b0b000.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4250" alt="DEMONO（デモノ）体験をモノに。" src="/uploads-archive/2014/02/0095e64a6ea4d783f9175e6fe7b0b000.jpg" width="650" height="488" srcset="/uploads-archive/2014/02/0095e64a6ea4d783f9175e6fe7b0b000.jpg 1007w, /uploads-archive/2014/02/0095e64a6ea4d783f9175e6fe7b0b000-300x225.jpg 300w, /uploads-archive/2014/02/0095e64a6ea4d783f9175e6fe7b0b000-228x171.jpg 228w" sizes="(max-width: 650px) 100vw, 650px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://demono.co.jp/" target="_blank">DEMONO（デモノ）体験をモノに。</a></p>
<p>&nbsp;</p>
<h3>みんなのマーケット株式会社</h4>
<p>まだ創立3年程の会社です。<br />
くらしのマーケットというサイトを運営しています。<br />
シンプルな形で、円形の写真を使い人物を紹介しています。</p>
<p><a href="/uploads-archive/2014/02/7a1d52a1a1321362d9f08c035a6dabb3.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4256" alt="みんなのマーケット株式会社 - みんなのマーケット株式会社" src="/uploads-archive/2014/02/7a1d52a1a1321362d9f08c035a6dabb3.jpg" width="650" height="488" srcset="/uploads-archive/2014/02/7a1d52a1a1321362d9f08c035a6dabb3.jpg 1007w, /uploads-archive/2014/02/7a1d52a1a1321362d9f08c035a6dabb3-300x225.jpg 300w, /uploads-archive/2014/02/7a1d52a1a1321362d9f08c035a6dabb3-228x171.jpg 228w" sizes="(max-width: 650px) 100vw, 650px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://www.minma.jp/" target="_blank">みんなのマーケット株式会社</a></p>
<p>&nbsp;</p>
<h3>株式会社ワノコト</h4>
<p>埼玉にあるweb制作会社さんです。<br />
ブルーとオレンジを基調にしたサイトで、いいフラット感です。</p>
<p><a href="/uploads-archive/2014/02/851e1f12c68500da5a4bc38efe98633d.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4254" alt="ホームページ制作・システム開発 埼玉県（入間市・所沢市・飯能市・川越市）・東京中心のサイト制作 - 株式会社ワノコト" src="/uploads-archive/2014/02/851e1f12c68500da5a4bc38efe98633d.jpg" width="650" height="488" srcset="/uploads-archive/2014/02/851e1f12c68500da5a4bc38efe98633d.jpg 1007w, /uploads-archive/2014/02/851e1f12c68500da5a4bc38efe98633d-300x225.jpg 300w, /uploads-archive/2014/02/851e1f12c68500da5a4bc38efe98633d-228x171.jpg 228w" sizes="(max-width: 650px) 100vw, 650px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://www.wanokoto.jp/" target="_blank">ホームページ制作・システム開発 埼玉県（入間市・所沢市・飯能市・川越市）・東京中心のサイト制作 &#8211; 株式会社ワノコト</a></p>
<p>&nbsp;</p>
<h3>サイバーエージェント・クラウドファンディング</h4>
<p>クラウドファウンディングを運営しているサイバー系の会社さんです。<br />
カラフルで大きな写真を使用しています。こちらも人物紹介が円形の写真を使用していますね。</p>
<p><a href="/uploads-archive/2014/02/9d1a3bcfbd099922d2f84023f0268c33.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4253" alt="サイバーエージェント・クラウドファンディング" src="/uploads-archive/2014/02/9d1a3bcfbd099922d2f84023f0268c33-1024x731.jpg" width="650" height="464" srcset="/uploads-archive/2014/02/9d1a3bcfbd099922d2f84023f0268c33-1024x731.jpg 1024w, /uploads-archive/2014/02/9d1a3bcfbd099922d2f84023f0268c33-300x214.jpg 300w, /uploads-archive/2014/02/9d1a3bcfbd099922d2f84023f0268c33-228x162.jpg 228w, /uploads-archive/2014/02/9d1a3bcfbd099922d2f84023f0268c33.jpg 1162w" sizes="(max-width: 650px) 100vw, 650px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://www.ca-crowdfunding.com/" target="_blank">サイバーエージェント・クラウドファンディング</a></p>
<p>&nbsp;</p>
<h3>株式会社フォーデジットデザイン</h4>
<p>都内にあるweb制作会社さんです。<br />
横幅いっぱいの写真を使っていますが、フラットというよりミニマルに近いでしょうか？<br />
ホワイトを基調としておりキレイにできています。<br />
ページの切り替わりもオシャレです。</p>
<p><a href="/uploads-archive/2014/02/12546e8883696b2ec72adfb01082e9a4.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4251" alt="FOURDIGIT DESIGN Inc.  株式会社フォーデジットデザイン" src="/uploads-archive/2014/02/12546e8883696b2ec72adfb01082e9a4-1024x731.jpg" width="650" height="464" srcset="/uploads-archive/2014/02/12546e8883696b2ec72adfb01082e9a4-1024x731.jpg 1024w, /uploads-archive/2014/02/12546e8883696b2ec72adfb01082e9a4-300x214.jpg 300w, /uploads-archive/2014/02/12546e8883696b2ec72adfb01082e9a4-228x162.jpg 228w, /uploads-archive/2014/02/12546e8883696b2ec72adfb01082e9a4.jpg 1162w" sizes="(max-width: 650px) 100vw, 650px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://4dd.jp/" target="_blank">FOURDIGIT DESIGN Inc. | 株式会社フォーデジットデザイン</a></p>
<p>&nbsp;</p>
<h3>LIVESENSE made*</h4>
<p>リブセンスさんの採用専用サイトです。<br />
大きな写真をメインにしようし、アクセントがブルー、グレーを基調としています。<br />
スッキリしていてみやすいですね。<br />
こちらも人物紹介に円形の写真を使用しています。</p>
<p><a href="/uploads-archive/2014/02/LIVESENSE-made.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4252" alt="LIVESENSE made" src="/uploads-archive/2014/02/LIVESENSE-made-1024x731.jpg" width="651" height="464" srcset="/uploads-archive/2014/02/LIVESENSE-made-1024x731.jpg 1024w, /uploads-archive/2014/02/LIVESENSE-made-300x214.jpg 300w, /uploads-archive/2014/02/LIVESENSE-made-228x162.jpg 228w, /uploads-archive/2014/02/LIVESENSE-made.jpg 1162w" sizes="(max-width: 651px) 100vw, 651px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://made.livesense.co.jp/" target="_blank">LIVESENSE made*</a></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>上記のサイトを見て思ったのが、<br />
サイトの横幅はブラウザいっぱいで枠を設けてなく、<br />
コンテンツ毎の区切りで色を変更したり、<br />
写真を横幅いっぱいで使用したりしていますね。</p>
<p>基本的には縦長で、余白を十分にとり、<br />
スクロールと連動させた動きをつけているサイトも多くありました。</p>
<p>人物紹介で写真を円形にしているサイトが多くあったのがちょっと気になりました。</p>


フラットデザインで制作されたワンカラムの縦長ページサイト7選

<p>地味だけどありがたい機能を提供してくれるプラグイン。</p>
<p>今でも印刷を想定してほしいとの依頼は時々あり、昔は印刷用に別ページを作ってポップアップさせたこともあった。</p>
<p><a class="demo" href="/demo/hoshino/51/">デモ</a></p>
<p>設定は簡単で、まずはこちらからjsファイルをダウンロード。</p>
<p><a href="/demo/hoshino/51/js/jquery.jPrintArea.js" target="_blank">/demo/hoshino/51/js/jquery.jPrintArea.js</a></p>
<p>あとはHTMLに対し</p>

		<div id="crayon-64953fd597c57071736409" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">XHTML</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
&lt;div id="area1"&gt;
    &lt;img src="images/1.jpg"&gt;
hogehogehogehogehogehogehogehoge
    &lt;p&gt;&lt;input type="button" value="ここまでを印刷" id="btn1"&gt;&lt;/p&gt;
&lt;/div&gt;</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597c57071736409-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597c57071736409-2">2</div><div class="crayon-num" data-line="crayon-64953fd597c57071736409-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597c57071736409-4">4</div><div class="crayon-num" data-line="crayon-64953fd597c57071736409-5">5</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597c57071736409-1"><span class="crayon-r ">&lt;div </span><span class="crayon-e ">id</span>=<span class="crayon-s ">"area1"</span><span class="crayon-r ">&gt;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597c57071736409-2"><span class="crayon-i ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-r ">&lt;img </span><span class="crayon-e ">src</span>=<span class="crayon-s ">"images/1.jpg"</span><span class="crayon-r ">&gt;</span></div><div class="crayon-line" id="crayon-64953fd597c57071736409-3"><span class="crayon-i ">hogehogehogehogehogehogehogehoge</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597c57071736409-4"><span class="crayon-i ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-r ">&lt;p&gt;</span><span class="crayon-r ">&lt;input </span><span class="crayon-e ">type</span>=<span class="crayon-s ">"button"</span><span class="crayon-h"> </span><span class="crayon-e ">value</span>=<span class="crayon-s ">"ここまでを印刷"</span><span class="crayon-h"> </span><span class="crayon-e ">id</span>=<span class="crayon-s ">"btn1"</span><span class="crayon-r ">&gt;</span><span class="crayon-r ">&lt;/p&gt;</span></div><div class="crayon-line" id="crayon-64953fd597c57071736409-5"><span class="crayon-r ">&lt;/div&gt;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>JSはこのように実行する。</p>

		<div id="crayon-64953fd597c5b218972402" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">JavaScript</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
$( '#btn1' ).click( function()
{
	$.jPrintArea( '#area1' );
});</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597c5b218972402-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597c5b218972402-2">2</div><div class="crayon-num" data-line="crayon-64953fd597c5b218972402-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597c5b218972402-4">4</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597c5b218972402-1"><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-h"> </span><span class="crayon-s">'#btn1'</span><span class="crayon-h"> </span><span class="crayon-sy">)</span><span class="crayon-sy">.</span><span class="crayon-e">click</span><span class="crayon-sy">(</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597c5b218972402-2"><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-64953fd597c5b218972402-3"><span class="crayon-h">	</span><span class="crayon-sy">$</span><span class="crayon-sy">.</span><span class="crayon-e">jPrintArea</span><span class="crayon-sy">(</span><span class="crayon-h"> </span><span class="crayon-s">'#area1'</span><span class="crayon-h"> </span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597c5b218972402-4"><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>&nbsp;</p>
<p>製品一覧とかマニュアルとかスペック表などでわざわざPDFにしていた場合も使えそう。</p>
<p>&nbsp;</p>
<p>&nbsp;</p>

印刷範囲を指定できるjQueryプラグイン

<h2>ミャンマーへの国別入国者数</h3>
<p><img decoding="async" src="/uploads-archive/2014/02/yangon.png" alt="" width="650"></p>
<p>日本人の数は一年間で倍以上増えて2位まで登りました。</p>
<h2>ヤンゴン日本人商工会議所の会員数推移</h3>
<p><img decoding="async" src="/uploads-archive/2014/02/yangon_nihon.png" alt="" width="650"></p>
<h2>外国投資の国別認可額(1989年~2013年10月末)</h3>
<p><img decoding="async" src="/uploads-archive/2014/02/bunya1.png" alt="" width="350"></p>
<h2>外国投資の分野別認可額(1989年~2013年10月末)</h3>
<p><img decoding="async" src="/uploads-archive/2014/02/bunya2.png" alt="" width="350"></p>


ミャンマービジネス変化の調査

<p>There are many ways to set up a Android mobile development environment.</p>
<p><strong>1) Android Studio(based on IntelliJ IDEA IDE)</strong></p>
<p>http://developer.android.com/sdk/installing/studio.html</p>
<p>This is the easiest way to start an Android dev env as a beginner. Please just download:</p>
<p><em>For window,</em></p>
<p><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;"> android-studio-bundle-&lt;version&gt;.exe</span></p>
<p><em>For Mac,</em></p>
<p>android-studio-bundle-&lt;version&gt;.dmg</p>
<p><em>For Linux,</em></p>
<p>android-studio-bundle-&lt;version&gt;.tgz</p>
<ol>
<li>Unpack the downloaded Tar file</li>
<li>To launch Android Studio, navigate to the <code>android-studio/bin/</code> directory in a terminal and execute <code>studio.sh</code>. [Ref: http://developer.android.com/sdk/installing/studio.html]</li>
</ol>
<p><strong>2) Android Developer Tools (ADT Bundle &#8211; Eclipse with the ADT Plugin)</strong></p>
<p>http://developer.android.com/sdk/index.html</p>
<p>Please just download respective .zip file for selected OS.</p>
<p><strong>3) Eclipse (IDE) + Android SDK</strong></p>
<p>You need to install Eclipse IDE. Assume that you have already install JAVA SDK (http://www.oracle.com/technetwork/java/javase/downloads/index.html).</p>
<p>You need to download Android SDK from &#8220;<strong>SDK Tools Only</strong>&#8221; sections of http://developer.android.com/sdk/index.html.</p>
<p>When you set up Eclipse for android development, you need to link Eclipse with respective JAVA SDK and android SDK manually.</p>
<p><strong>4) IntelliJ (IDE) + Android SDK</strong></p>
<p>Download IntelliJ IDE from this link: http://www.jetbrains.com/idea/</p>
<p>You are assumed that you&#8217;ve already installed JAVA SDK.</p>
<p>Download Android SDK from &#8220;<strong>SDK Tools Only</strong>&#8221; section of http://developer.android.com/sdk/index.html</p>
<p>When you set up IntelliJ for android development, you need to link IntelliJ with respective JAVA SDK and android SDK manually.</p>
<p>Enjoy!!!</p>


Easy ways to setting up an Android Dev

<p>日本語フォントでは、基本一つ一つの文字が等幅で作られていることがほとんどで、</p>
<p>ウェブサイト上でテキストによって文字組をした場合に、不自然な文字間隔になってしまう場所が出てきます。</p>
<p>フラットデザインやレスポンシブデザインが標準化傾向にある今、</p>
<p>ウェブサイトでの文字は文章はもちろんのこと、テキストにおいても画像を使わずテキストを使う必要性が高まってきており、</p>
<p>日本語フォント独特の文字間隔の不自然さが、ウェブデザインでの障害となることもあります。</p>
<p>&nbsp;</p>
<p>そんな中、ウェブページのテキストの文字詰めを自動でしてくれるJSが公開されていましたので、</p>
<p>こちらをご紹介いたします。</p>
<p><a class="link" href="http://fladdict.net/blog/2011/02/auto-kerning.html" target="_blank">HTMLで文字詰めするタイポグラフィー用JS</a></p>
<p>ファイルはこちらのサイトよりダウンロードください。</p>
<p>&nbsp;</p>
<p>↓DEMO作ってみました。</p>
<p><a class="demo" title="DEMO" href="/demo/ninomiya/40/" target="_blank">DEMO</a></p>
<p>&nbsp;</p>
<h2>使い方</h3>
<p>まず、jQueryとダウンロードした文字詰めのJSファイルを読み込みます。</p>

		<div id="crayon-64953fd597a64243774703" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title">HTML</span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">XHTML</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
&lt;script type="text/javascript" src="js/jquery-1.9.1.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="js/FLAutoKerning.js"&gt;&lt;/script&gt;</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597a64243774703-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597a64243774703-2">2</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597a64243774703-1"><span class="crayon-ta">&lt;script </span><span class="crayon-e ">type</span>=<span class="crayon-s">"text/javascript"</span><span class="crayon-h"> </span><span class="crayon-e ">src</span>=<span class="crayon-s">"js/jquery-1.9.1.min.js"</span><span class="crayon-h">&gt;</span><span class="crayon-ta">&lt;/script&gt;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597a64243774703-2"><span class="crayon-ta">&lt;script </span><span class="crayon-e ">type</span>=<span class="crayon-s">"text/javascript"</span><span class="crayon-h"> </span><span class="crayon-e ">src</span>=<span class="crayon-s">"js/FLAutoKerning.js"</span><span class="crayon-h">&gt;</span><span class="crayon-ta">&lt;/script&gt;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>&nbsp;</p>
<p>次に、文字詰めを行うHTML要素に、</p>
<p>FLAutoKerning.process($(&#8216;対象の要素&#8217;));</p>
<p>と行った形でスクリプトをあてます。</p>

		<div id="crayon-64953fd597a68292024937" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">JavaScript</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
$(function(){
	FLAutoKerning.process($('.group2 h1'));
	FLAutoKerning.process($('.group2 nav li a'));
	FLAutoKerning.process($('.group2 h2'));
	FLAutoKerning.process($('.group2 section .text'));
});</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597a68292024937-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597a68292024937-2">2</div><div class="crayon-num" data-line="crayon-64953fd597a68292024937-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597a68292024937-4">4</div><div class="crayon-num" data-line="crayon-64953fd597a68292024937-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597a68292024937-6">6</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597a68292024937-1"><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-t">function</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597a68292024937-2"><span class="crayon-h">	</span><span class="crayon-i">FLAutoKerning</span><span class="crayon-sy">.</span><span class="crayon-e">process</span><span class="crayon-sy">(</span><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-s">'.group2 h1'</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597a68292024937-3"><span class="crayon-h">	</span><span class="crayon-i">FLAutoKerning</span><span class="crayon-sy">.</span><span class="crayon-e">process</span><span class="crayon-sy">(</span><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-s">'.group2 nav li a'</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597a68292024937-4"><span class="crayon-h">	</span><span class="crayon-i">FLAutoKerning</span><span class="crayon-sy">.</span><span class="crayon-e">process</span><span class="crayon-sy">(</span><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-s">'.group2 h2'</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597a68292024937-5"><span class="crayon-h">	</span><span class="crayon-i">FLAutoKerning</span><span class="crayon-sy">.</span><span class="crayon-e">process</span><span class="crayon-sy">(</span><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-s">'.group2 section .text'</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597a68292024937-6"><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>これで文字詰めが行われます。</p>
<p>文字詰めを行う文字一つ一つが&lt;span&gt;で囲まれますので、&lt;span&gt;で文字の大きさや色などを指定していたりする場合は注意が必要です。</p>
<p>&nbsp;</p>
<p>全体として文字の間にできる不自然な空白が抑えられ、</p>
<p>特に句読点や括弧などの前後にできる大きな空白が抑えられているので、</p>
<p>まとまった感じがします。</p>
<p>&nbsp;</p>
<p>等幅でなくなるため、行の終わりが揃わなくなるという問題が出てくるため、</p>
<p>タイトルやキャッチコピーなどでの利用に抑えたり、</p>
<p>センタリングや右寄せした文章のような、行の終わりをそろえる必要がないような箇所に使うなどの利用法がいいかもしれません。</p>

日本語の文字詰め(カーニング)を自動で調整してくれるjQuery

vagrant

<p>wordpressでお問い合わせを設置するとなれば、高い確率でこのプラグインが導入されますが、</p>
<p>ちょっといろいろ問題とまでは言いませんが、引っかかるポイントがあります。</p>
<p>&nbsp;</p>
<p>・確認画面がでない</p>
<p>・スパムがけっこうくる</p>
<p>・メール返信がなんか変</p>
<p>&nbsp;</p>
<p>地味に困ることがありますね笑</p>
<p>&nbsp;</p>
<p>その対策をすることがあるので、その解決で参考になったブログを紹介したいと思います。</p>
<p>&nbsp;</p>
<h2>確認画面がでない</h3>
<p>まずこちらですが、確認画面を出すようにすることができるという噂を聞いたことがあるのですが、<br />
まだ試してことはありません。</p>
<p>確認画面が出るプラグインもあるみたいので、<br />
どうしても確認画面が欲しい人は以下のプラグインを使ってみてはいかがでしょうか。</p>
<p><a href="http://hinagata.biz/plugin/inquiry-form-creator/">【inquiry form creator】簡単３ステップで確認画面付きの問い合わせフォームが設置できるWordPressプラグイン &#8211; ひなログ</a></p>
<p>次の項目とかぶるのですが、<br />
確認画面を表示しなくても以下のブログのようにすれば十分な気がします。</p>
<p><a href="http://bizvektor.com/plugins/contactform7/" target="_blank">意外と知らない !? お問い合わせフォーム「Contact Form 7」をもっと便利に使いこなすための3つのポイント | プラグイン紹介 | BizVektor [ ビズベクトル ] スマホ対応無料WordPressテーマ（テンプレート）</a></p>
<h2>スパムがけっこうくる</h3>
<p>こちらも少々やっかいで、通常通り設置すると、<br />
スパムがどんどん来ます。</p>
<p>うちのサイトもよく来ていたので、画像認証的なものを導入しました。<br />
ただ、これはもうひとつ別のプラグインを入れないといけないし、<br />
ユーザーもめんどくさいかと思います。</p>
<p>こちらのブログのようにすれば僕が行った対策より簡単です！</p>
<p><a href="http://curious-everything.com/1089-entry.html">Contact Form 7 に追加すればスパムが届かなくなる魔法の1行 | 毎日興味津々</a></p>
<h2>メール返信がなんか変</h3>
<p>これはお問い合わせからくるメールのfromがおかしかったり、<br />
迷惑メールに届いちゃったりということが起こってしまう件です。</p>
<p>これはこのプラグインの設定でサーバーを経由してしまうからうんぬんかんぬんらしいですが、<br />
そこらへんのことはよくわからないので、完璧に理解していませんが、そちらを解決するためのブログが以下になります。</p>
<p><a href="http://www.ssw2005.net/968" target="_blank">ContactForm7から送信すると迷惑メールと判別される場合の対応方法 | えびす商売繁盛マーケティング</a></p>
<p><a href="http://coneta.jp/2579.html" target="_blank">WordPress(ワードプレス) SMTPサーバを変更できるプラグイン「WP Mail SMTP」 | CONETA.JP</a></p>
<p>もっといいプラグインが現れるようなそんな気がします。。。</p>


wordpressの『contact form 7』プラグインをもっと使いこなすためのTIPS

<p>前回、リストバンド型のウェアラブルデバイスを紹介しましたので、今回は、Googleグラスといったデバイスが話題沸騰しているメガネ型ウェアラブルデバイスをまとめてみました。</p>
<article>
<h2>Googleグラス</h3>
<p><a href="/uploads-archive/2014/02/imgres1.jpg"><img decoding="async" loading="lazy" alt="imgres" src="/uploads-archive/2014/02/imgres1.jpg" width="300" height="168" /></a></p>
<p>言わずとしれたGoogleのスマートグラス</p>
<p>網膜に映像を映しだすバーチャルディスプレイ</p>
<p><a href="http://www.google.com/glass/start/ " target="_blank">http://www.google.com/glass/start/ </a></p>
<h2>Telepathy One</h3>
<p><a href="/uploads-archive/2014/02/imgres2.jpg"><img decoding="async" loading="lazy" alt="imgres" src="/uploads-archive/2014/02/imgres2-300x157.jpg" width="300" height="157" /></a></p>
<p>セカイカメラで知られた頓智ドットの元代表が新たに手がける国産のスマートグラス</p>
<p>コミュニケーションツールとしての映像を残すといったところを売りに出している。GoogleGlass同様にバーチャルディスプレイ</p>
<p><a href="http://tele-pathy.org/" target="_blank">http://tele-pathy.org/</a></p>
<h2>MOVERIO BT-200</h3>
<p><a href="/uploads-archive/2014/02/imgres4.jpg"><img decoding="async" loading="lazy" alt="imgres" src="/uploads-archive/2014/02/imgres4.jpg" width="275" height="183" /></a></p>
<p>日本のメーカーEPSONもスマートグラスに参戦</p>
<p>映像が投影されるパーソナルシアターを強調しています。</p>
<p><a href="http://www.epson.jp/products/moverio/bt200/" target="_blank">http://www.epson.jp/products/moverio/bt200/</a></p>
<p>&nbsp;</p>
<h2>M100スマートグラス</h3>
<p><a href="/uploads-archive/2014/02/imgres3.jpg"><img decoding="async" loading="lazy" alt="imgres" src="/uploads-archive/2014/02/imgres3.jpg" width="286" height="176" /></a></p>
<p>こちらもどちらかというと、Android端末でできることを強調しているスマートグラス</p>
<p><a href="http://www.vuzix.co.jp/shop/item_detail?category_id=0&amp;item_id=925952" target="_blank">http://www.vuzix.co.jp/shop/item_detail?category_id=0&amp;item_id=925952</a></p>
<h2>まとめ</h3>
<p>やはり本命はGoogleGlassといったところでしょうか？</p>
<p>こうしてみると前者の２つがコミュニケーションを売りにしているのに対し、後者の２つは映像を目の前に投影する、メガネ型のAndroid機といったところを強調しており、目指すべきところが全く異なることが分かった。</p>
</article>
<div></div>


メガネ型ウェアラブルデバイスもいよいよ流行の兆し

<p>ZNAPとはQRを使った決済プラットフォーム。</p>
<p><a href="http://consumer.znap.com/" target="_blank">http://consumer.znap.com/</a></p>
<p>香港に拠点を置くMPayMe社が展開するサービスで、実は昨年から日本版が公開されていたとのことだが</p>
<p>知らなかったので使ってみた。</p>
<p>&nbsp;</p>
<p>まずはアプリをダウンロードする。</p>
<p><a href="/uploads-archive/2014/02/36c8c9261c98e7c1b7d7d5e14410cdda.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4183" alt="写真 1" src="/uploads-archive/2014/02/36c8c9261c98e7c1b7d7d5e14410cdda-200x300.png" width="200" height="300" srcset="/uploads-archive/2014/02/36c8c9261c98e7c1b7d7d5e14410cdda-200x300.png 200w, /uploads-archive/2014/02/36c8c9261c98e7c1b7d7d5e14410cdda-228x342.png 228w, /uploads-archive/2014/02/36c8c9261c98e7c1b7d7d5e14410cdda.png 640w" sizes="(max-width: 200px) 100vw, 200px" /></a></p>
<p>&nbsp;</p>
<p>個人情報を登録して会員登録。</p>
<p>登録後クレジットカード情報を予め登録しておくとすぐに使える模様。</p>
<p>ただし現在はVISAとMasterのみ対応しているらしい。(今後はその他カードと銀行引き落としも対応するとのこと)</p>
<p><a href="/uploads-archive/2014/02/d97c50263c64191b4a87e849b78211fe.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4185" alt="写真 2" src="/uploads-archive/2014/02/d97c50263c64191b4a87e849b78211fe-200x300.png" width="200" height="300" srcset="/uploads-archive/2014/02/d97c50263c64191b4a87e849b78211fe-200x300.png 200w, /uploads-archive/2014/02/d97c50263c64191b4a87e849b78211fe-228x342.png 228w, /uploads-archive/2014/02/d97c50263c64191b4a87e849b78211fe.png 640w" sizes="(max-width: 200px) 100vw, 200px" /></a></p>
<p>&nbsp;</p>
<p>QRを読み込む画面はこんな感じ</p>
<p><a href="/uploads-archive/2014/02/cb21c53e01edf9fb25f6ab527a681e99.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4186" alt="写真 3" src="/uploads-archive/2014/02/cb21c53e01edf9fb25f6ab527a681e99-200x300.png" width="200" height="300" srcset="/uploads-archive/2014/02/cb21c53e01edf9fb25f6ab527a681e99-200x300.png 200w, /uploads-archive/2014/02/cb21c53e01edf9fb25f6ab527a681e99-228x342.png 228w, /uploads-archive/2014/02/cb21c53e01edf9fb25f6ab527a681e99.png 640w" sizes="(max-width: 200px) 100vw, 200px" /></a>デモ用のQRがなかったのでキャプチャはここまで。</p>
<p>&nbsp;</p>
<p>買う方としては簡単に取り出して決済ができて、なおかつポイントがたまるので便利。</p>
<p>何がすごいかというのを以下自分なりにまとめてみた。</p>
<p>&nbsp;</p>
<h2> ポスターから直購入</h3>
<p>電車の待ち時間に目の前のポスターから直接購入できる。</p>
<p>また、これはポスターだけではなくカタログやフライヤーなど全ての紙媒体に言えることだ。</p>
<p>今まで成果が見えづらかった屋外広告がトレースできるだけでなく直接売上につながるのは新しい感覚だ。</p>
<p>&nbsp;</p>
<h2>小規模小売店で</h3>
<p>SquareやCoineyは結局設備投資を抑えたい小さな小売店に強いニーズがあるが<br />
ZNAPはそれらに必要な一切の端末が不要。</p>
<p>お品書きにQRをそれぞれ記載しておくこともできるし、<br />
合計金額を計算後画面にQRが出るようにすればトータルでの会計もきる。</p>
<p>むしろクレジットカードを持っている必要はない。</p>
<p>実は飲食店バージョンはZNAP自らコンセプトショップをやっているとのこと。</p>
<p><a href="http://consumer.znap.com/ja_JP/znap-news-press.html#znap-qrbar_16" target="_blank"> http://consumer.znap.com/ja_JP/znap-news-press.html#znap-qrbar_16</a></p>
<p>手数料も安く、3.24％とのこと。</p>
<p>&nbsp;</p>
<h2>販促</h3>
<p>提携店舗のクーポン情報を受け取れる。(使い込んでいないがおそらく位置情報でクーポンを受け取れる)</p>
<p>また、購入履歴には商品情報の他に位置情報も記憶されており、ニーズを抽出してクーポンをレコメンドできる。</p>
<p>あとはポイントがたまるので利用価値も高くなる。</p>
<p>&nbsp;</p>
<h2>まとめ</h3>
<p>非常によく出来た良い仕組みと思うが、最終的には対応店舗がネックになると思うので</p>
<p>これからはマーケティングが最も重要と感じた。</p>
<p>過去記事などを見ると計画的にマーケティングをしているようで、トータルで期待できる気がする。</p>
<p>あとはどこか大規模な超有名店が対応するなどして一気に広がるかもしれない。</p>
<p>ジャンルはわからないが、動きやすく競争過多である飲食店などで導入されるかもしれない。</p>


あらゆる場所が店になるZNAP

jQueryとWebフォントでスマホの傾きで色の変わるアイコンを作ってみる

<p>PHPには、関数の引数の対象が変数のみになるものがあります。<br />
一番よく使うのは多分issetやemptyになります。<br />
ありがちかつ訳分からないミスは、関数を引数として、issetやemptyに渡すことです。<br />
サンプルコードを見てみましょう。</p>
<p></p>

		<div id="crayon-64953fd597400981650628" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">PHP</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
&lt;?php
$user = new User();
// 正
if (isset($user-&gt;name) &amp;&amp; !empty($user-&gt;name)) {
	// 直接属性(変数)を使うならOK→nameはpublicだから外部からもアクセスできる
}
// 誤
if (isset($user-&gt;getAge()) &amp;&amp; !empty($user-&gt;getAge())) {
	// issetやemptyに関数（メソッド）は使えない→syntax errorになる
	// Fatal error: Can't use function return value in write context 
}
// これならOK
$age = $user-&gt;getAge();
if (isset($age) &amp;&amp; !empty($age)) {

}

class User
{
	public $name;

	private $age;

    public function getName()
    {
        return $this-&gt;name;
    }

    public function setName($name)
    {
        $this-&gt;name = $name;
    }


    public function getAge()
    {
        return $this-&gt;age;
    }

    public function setAge($age)
    {
        $this-&gt;age = $age;
    }

}</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597400981650628-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-2">2</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-4">4</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-6">6</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-8">8</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-9">9</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-10">10</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-11">11</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-12">12</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-13">13</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-14">14</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-15">15</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-16">16</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-17">17</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-18">18</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-19">19</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-20">20</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-21">21</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-22">22</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-23">23</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-24">24</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-25">25</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-26">26</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-27">27</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-28">28</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-29">29</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-30">30</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-31">31</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-32">32</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-33">33</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-34">34</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-35">35</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-36">36</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-37">37</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-38">38</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-39">39</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-40">40</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-41">41</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-42">42</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-43">43</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-44">44</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-45">45</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597400981650628-1"><span class="crayon-ta">&lt;?php</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-2"><span class="crayon-v">$user</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-r">new</span><span class="crayon-h"> </span><span class="crayon-e">User</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-3"><span class="crayon-c">// 正</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-4"><span class="crayon-st">if</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-k ">isset</span><span class="crayon-sy">(</span><span class="crayon-v">$user</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">name</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-sy">&amp;&amp; !empty($user-&gt;name)) {</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-5"><span class="crayon-sy">	// 直接属性(変数)を使うならOK→nameはpublicだから外部からもアクセスできる</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-6"><span class="crayon-sy">}</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-7"><span class="crayon-sy">// 誤</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-8"><span class="crayon-sy">if (isset($user-&gt;getAge()) &amp;&amp; !empty($user-&gt;getAge())) {</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-9"><span class="crayon-sy">	// issetやemptyに関数（メソッド）は使えない→syntax errorになる</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-10"><span class="crayon-sy">	// Fatal error: Can't use function return value in write context </span></div><div class="crayon-line" id="crayon-64953fd597400981650628-11"><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-12"><span class="crayon-sy">// これならOK</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-13"><span class="crayon-sy">$age = $user-&gt;getAge();</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-14"><span class="crayon-st">if</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-k ">isset</span><span class="crayon-sy">(</span><span class="crayon-v">$age</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-sy">&amp;&amp; !empty($age)) {</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-15">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-16"><span class="crayon-sy">}</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-17">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-18"><span class="crayon-sy">class User</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-19"><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-20"><span class="crayon-sy">	public $name;</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-21">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-22"><span class="crayon-h">	</span><span class="crayon-m">private</span><span class="crayon-h"> </span><span class="crayon-v">$age</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-23">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-24"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-m">public</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-h"> </span><span class="crayon-e">getName</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-25"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-26"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-k ">return</span><span class="crayon-h"> </span><span class="crayon-v">$this</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">name</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-27"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-28">&nbsp;</div><div class="crayon-line" id="crayon-64953fd597400981650628-29"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-m">public</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-h"> </span><span class="crayon-e">setName</span><span class="crayon-sy">(</span><span class="crayon-v">$name</span><span class="crayon-sy">)</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-30"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-31"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-v">$this</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">name</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-v">$name</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-32"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">}</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-33">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-34">&nbsp;</div><div class="crayon-line" id="crayon-64953fd597400981650628-35"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-m">public</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-h"> </span><span class="crayon-e">getAge</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-36"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-37"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-k ">return</span><span class="crayon-h"> </span><span class="crayon-v">$this</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">age</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-38"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">}</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-39">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-40"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-m">public</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-h"> </span><span class="crayon-e">setAge</span><span class="crayon-sy">(</span><span class="crayon-v">$age</span><span class="crayon-sy">)</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-41"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-42"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-v">$this</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">age</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-v">$age</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-43"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-44">&nbsp;</div><div class="crayon-line" id="crayon-64953fd597400981650628-45"><span class="crayon-sy">}</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p> </p>
<p>これらの関数の一覧は<a href="http://www.php.net/manual/ja/ref.var.php" target="_blank">ここ</a>です。</p>

【PHP】変数操作関数

<p>サーバ監視の観点でツール調べてみましたが、<br />
需要がクライアントごと違いますので、カスタマイズせずに直接使うのは難しいかと思います。<br />
Linuxサーバが付いている無料のツールlogwatchを使って、レポートの内容をカスタマイズするやり方がいいかと思います。<br />
※ただし、レポートは英語と、たまにログの内容そのままが出てくるのは難点です。</p>
<h2>インストールおよび設定</h3>
<p><a href="http://blog.thingslabo.com/archives/000054.html">こちら</a>が分かりやすいかと思います。<br />
設定項目が多いので、また調査中です。</p>
<h2>レポートの内容</h3>
<p>レポートが指定されたメールアドレスに送信されますので、下記はその内容の抜粋です。</p>
<h3>cron</h4>
<p>実行のスクリプトとその回数</p>
<h3>mail（dovecot→受信、postfix→送信）</h4>
<p>１、受信をするため、ユーザごとのログイン回数（IP付き）<br />
２、送信メールの数、および拒否したRelay（こちらのサーバを使ってメールを転送すること）</p>
<h3>httpd</h4>
<p>１、転送総量とタイプ別（Image/Document/Archive/Sound file/Content page/Redirect/Font/Other）の転送量<br />
２、検知したハッキング（回数、IP付き）<br />
３、レスポンスエラー（エラーコード別でurlと回数がでてくる）<br />
４、robotの訪問回数（UA付き）</p>
<h3>sshd</h4>
<p>不正ログインしようとしていたIPと回数（アカウント別、使ったパスワードまで分かる）</p>
<h3>disk space</h4>
<p>どれぐらい残っているかが分かる</p>
<h2>レポートを見た感想</h3>
<p>・文字だけで少々分かりにくい<br />
・ハッキングが多いからセキュリティを許可すべく</p>


logwatch

<p>Sometimes, you&#8217;re setting up your web server(Apache, Nginx etc) in your local computer. It means your web server is running locally and outside world can&#8217;t access to it, other computer in same intranet can access your IP though.</p>
<p>Let&#8217;s say, you have developed a web project in your local. You haven&#8217;t uploaded projects files and folders to remote hosting server. At that time, your client wanna check the project&#8217;s progress at once.</p>
<p>No need to worry in such case. You can immediately setup a localtunnel that can be accessed by outside world with a URL link.</p>
<p>So simple steps you need to do:</p>
<h2>Step 1: Download ngrok</h3>
<p style="padding-left: 30px;">https://ngrok.com/download</p>
<h2>Step 2: Unzip it</h3>
<p style="padding-left: 30px;"><code>$ unzip /path/to/ngrok.zip</code></p>
<h2>Step 3: Run it! (in terminal)</h3>
<p style="padding-left: 30px;"><code>$ ./ngrok -help</code> [if you wanna check how does it work]</p>
<p style="padding-left: 30px;">$ ./ngrok <code>80</code> [eg; local web server is running in port <code>80</code>]</p>
<p>Sample command line output:</p>

		<div id="crayon-64953fd59721c252203341" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
ngrok

Tunnel Status               online
Version                     1.3/1.3
Forwarding                  http://3a4bfceb.ngrok.com -&amp;gt; 127.0.0.1:80
Forwarding                  https://3a4bfceb.ngrok.com -&amp;gt; 127.0.0.1:80
Web Interface               http://127.0.0.1:4040
# Conn                      0
Avg Conn Time               0.00ms</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd59721c252203341-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59721c252203341-2">2</div><div class="crayon-num" data-line="crayon-64953fd59721c252203341-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59721c252203341-4">4</div><div class="crayon-num" data-line="crayon-64953fd59721c252203341-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59721c252203341-6">6</div><div class="crayon-num" data-line="crayon-64953fd59721c252203341-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59721c252203341-8">8</div><div class="crayon-num" data-line="crayon-64953fd59721c252203341-9">9</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd59721c252203341-1"><span class="crayon-e">ngrok</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59721c252203341-2">&nbsp;</div><div class="crayon-line" id="crayon-64953fd59721c252203341-3"><span class="crayon-e">Tunnel </span><span class="crayon-e">Status&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span class="crayon-e">online</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59721c252203341-4"><span class="crayon-i">Version</span><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span class="crayon-cn">1.3</span>/<span class="crayon-cn">1.3</span></div><div class="crayon-line" id="crayon-64953fd59721c252203341-5"><span class="crayon-e">Forwarding&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-i">http</span><span class="crayon-sy">:</span><span class="crayon-c">//3a4bfceb.ngrok.com -&amp;gt; 127.0.0.1:80</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59721c252203341-6"><span class="crayon-e">Forwarding&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-i">https</span><span class="crayon-sy">:</span><span class="crayon-c">//3a4bfceb.ngrok.com -&amp;gt; 127.0.0.1:80</span></div><div class="crayon-line" id="crayon-64953fd59721c252203341-7"><span class="crayon-e">Web </span><span class="crayon-t">Interface</span><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span class="crayon-i">http</span><span class="crayon-sy">:</span><span class="crayon-c">//127.0.0.1:4040</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59721c252203341-8"><span class="crayon-p"># Conn&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;0</span></div><div class="crayon-line" id="crayon-64953fd59721c252203341-9"><span class="crayon-e">Avg </span><span class="crayon-e">Conn </span><span class="crayon-i">Time</span><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span class="crayon-cn">0.00ms</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>Local running web server: http://127.0.0.1:80</p>
<p>Share this URL to client: <code>http://3a4bfceb.ngrok.com</code></p>
<p>Web traffic checking: http://127.0.0.1:4040</p>
<p><img decoding="async" alt="web-interface-checking-point" src="/uploads-archive/2014/01/inspect.png" /></p>
<p><span style="font-size: small;">[Ref img: from</span> https://ngrok.com/usage]</p>
<h2>Requiring passwords to access your tunnels</h3>
<p>By default, ngrok tunnels do not require any username or password to access them. This means anyone who knows or guesses the URL or your tunnel can make requests to it. You can secure your tunnels with a username and password by specifying the <code>-httpauth</code> option when creating your tunnel. This will force HTTP basic authentication on all incoming requests to your tunnels and require that the credentials match those you specify on the command line.</p>

		<div id="crayon-64953fd597220542547685" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
$ ngrok -httpauth="username:12345" 80</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597220542547685-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597220542547685-1"><span class="crayon-sy">$</span><span class="crayon-h"> </span><span class="crayon-i">ngrok</span><span class="crayon-h"> </span>-<span class="crayon-i">httpauth</span>=<span class="crayon-s">"username:12345"</span><span class="crayon-h"> </span><span class="crayon-cn">80</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>If you developer guy wanna quit running instance after checking the developed project by client, you just need to use simple command in terminal: [ Ctrl+C ]<br />
Outside world can not be available to access your shared link: <code>http://3a4bfceb.ngrok.com</code> anymore.</p>
<p>In next time, you will run ./ngrok 80 in terminal and you will get another shared link: eg; http://xxxxx.ngrok.com. Just send that new link to client or others else you want to send again.</p>
<p>Enjoy!!!</p>

Exposing your local web server to the Internet

<p>ナイキの「FuelBand（日本未上陸）」「UP by JAWBONE」「Fitbit One」らが昨年あたりから出始め、ライフログを残す、ヘルスケアを行うために日々の活動を記録していくリストバンド型の活動量計が流行っています。各社から製品が続々と登場しており、興味を持ってみましたので調べてみました。</p>
<h2>定番</h3>
<p>ヘルスケアバンドの火付け役ともいうべきモデル</p>
<h3>NIKE『 FUELBAND SE』</h4>
<p><a href="/uploads-archive/2014/01/fuelband.jpeg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4151" alt="fuelband" src="/uploads-archive/2014/01/fuelband-300x168.jpeg" width="300" height="168" srcset="/uploads-archive/2014/01/fuelband-300x168.jpeg 300w, /uploads-archive/2014/01/fuelband-1024x576.jpeg 1024w, /uploads-archive/2014/01/fuelband-228x128.jpeg 228w, /uploads-archive/2014/01/fuelband.jpeg 1600w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p><a href="http://www.nike.com/jp/ja_jp/c/nikeplus-fuelband" target="_blank">http://www.nike.com/jp/ja_jp/c/nikeplus-fuelband</a></p>
<p>&nbsp;</p>
<h3>JAWBONE『UP by JAWBONE』</h4>
<p><a href="/uploads-archive/2014/01/Jawbone-Up.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4152" alt="Jawbone-Up" src="/uploads-archive/2014/01/Jawbone-Up-300x168.jpg" width="300" height="168" srcset="/uploads-archive/2014/01/Jawbone-Up-300x168.jpg 300w, /uploads-archive/2014/01/Jawbone-Up-1024x576.jpg 1024w, /uploads-archive/2014/01/Jawbone-Up-228x128.jpg 228w, /uploads-archive/2014/01/Jawbone-Up.jpg 1200w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p><a href="https://jawbone.com/up/international" target="_blank">https://jawbone.com/up/international</a></p>
<p>&nbsp;</p>
<h3>Fitbit One</h4>
<p><a href="/uploads-archive/2014/01/fitbit-one.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4153" alt="fitbit-one" src="/uploads-archive/2014/01/fitbit-one-300x183.jpg" width="300" height="183" srcset="/uploads-archive/2014/01/fitbit-one-300x183.jpg 300w, /uploads-archive/2014/01/fitbit-one-228x139.jpg 228w, /uploads-archive/2014/01/fitbit-one.jpg 600w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p><a href="http://www.fitbit.com/jp/one" target="_blank">http://www.fitbit.com/jp/one</a></p>
<p>&nbsp;</p>
<h2>新規参入</h3>
<p>2014年の世界最大の家電市CESでは続々と大手企業が発表をしています。</p>
<h3>SONY『SmartBand』</h4>
<p><a href="/uploads-archive/2014/01/SmartBand.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4154" alt="SmartBand" src="/uploads-archive/2014/01/SmartBand-300x225.jpg" width="300" height="225" srcset="/uploads-archive/2014/01/SmartBand-300x225.jpg 300w, /uploads-archive/2014/01/SmartBand-228x171.jpg 228w, /uploads-archive/2014/01/SmartBand.jpg 620w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p><a href="http://www.gizmodo.jp/2014/01/ces_smartband_swr10.html">感情も追跡する!?　ソニーのフィットネスバンド「SmartBand SWR10」</a></p>
<h3>ガーミン『Vívofit』</h4>
<p><a href="/uploads-archive/2014/01/Garmin.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4155" alt="Garmin" src="/uploads-archive/2014/01/Garmin-300x168.jpg" width="300" height="168" srcset="/uploads-archive/2014/01/Garmin-300x168.jpg 300w, /uploads-archive/2014/01/Garmin-228x128.jpg 228w, /uploads-archive/2014/01/Garmin.jpg 640w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p><a href="http://www.gizmodo.jp/2014/01/ces_5.html">運動マニアじゃない人にこそオススメ！　ガーミンがフィットネスバンド市場に参入</a></p>
<h2>携帯キャリア</h3>
<p>日本の3キャリアも漏れなく発表しております。smartphoneを売りたいキャリアと相性がいいガジェットなんでしょうね。</p>
<h3>ドコモ・ヘルスケア『ムーヴバンド』</h4>
<p><a href="/uploads-archive/2014/01/moveband_img_2.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4157" alt="moveband_img_2" src="/uploads-archive/2014/01/moveband_img_2-300x120.jpg" width="300" height="120" srcset="/uploads-archive/2014/01/moveband_img_2-300x120.jpg 300w, /uploads-archive/2014/01/moveband_img_2-228x91.jpg 228w, /uploads-archive/2014/01/moveband_img_2.jpg 929w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p><a href="http://www.d-healthcare.co.jp/products/moveband/" target="_blank">http://www.d-healthcare.co.jp/products/moveband/</a></p>
<h3>au『SHINE™』</h4>
<p><a href="/uploads-archive/2014/01/shine-img-03.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4158" alt="shine-img-03" src="/uploads-archive/2014/01/shine-img-03-300x298.jpg" width="300" height="298" srcset="/uploads-archive/2014/01/shine-img-03-300x298.jpg 300w, /uploads-archive/2014/01/shine-img-03-150x150.jpg 150w, /uploads-archive/2014/01/shine-img-03-228x226.jpg 228w, /uploads-archive/2014/01/shine-img-03-120x120.jpg 120w, /uploads-archive/2014/01/shine-img-03.jpg 316w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p><a href="http://www.au.kddi.com/mobile/product/plus-one/iphone/special-shine/" target="_blank">http://www.au.kddi.com/mobile/product/plus-one/iphone/special-shine/</a></p>
<h3>SoftBank 『HealthCare』</h4>
<p><a href="/uploads-archive/2014/01/maxresdefault.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4156" alt="maxresdefault" src="/uploads-archive/2014/01/maxresdefault-300x168.jpg" width="300" height="168" srcset="/uploads-archive/2014/01/maxresdefault-300x168.jpg 300w, /uploads-archive/2014/01/maxresdefault-1024x576.jpg 1024w, /uploads-archive/2014/01/maxresdefault-228x128.jpg 228w, /uploads-archive/2014/01/maxresdefault.jpg 1280w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p><a href="http://www.softbank.jp/mobile/service/softbankhealthcare/" target="_blank">http://www.softbank.jp/mobile/service/softbankhealthcare/</a></p>
<h2>まとめ</h3>
<p>デザインはnike,up,sonyが抜けていますね。あとは、本来の機能や、閲覧のためのアプリの出来といったところの比較となるのでしょうがまだ情報が出揃っておらず、発売を控えている商品が多いため引き続きウォッチしていきたいと思います。</p>
<div id="extensionsWeblioEjBx" style="position: absolute; z-index: 2147483647; left: 298px; top: 2041px;"><iframe loading="lazy" src="//api.weblio.jp/act/quote/v_1_0/e/?q=moveband&amp;type=emicro&amp;opul=chrome-extension%3A%2F%2Foingodpdjohhkelnginmkagmkbplgema%2Foptions.html" name="weblioExtensionsFrame" width="380" height="60" border="0" frameborder="0" scrolling="no"></iframe></div>
<div id="extensionsWeblioEjBx" style="position: absolute; z-index: 2147483647; left: 22px; top: 570px;"><iframe loading="lazy" src="//api.weblio.jp/act/quote/v_1_0/e/?q=UP&amp;type=emicro&amp;opul=chrome-extension%3A%2F%2Foingodpdjohhkelnginmkagmkbplgema%2Foptions.html" name="weblioExtensionsFrame" width="380" height="60" border="0" frameborder="0" scrolling="no"></iframe></div>


2014年はフィットネスバンド元年？

<p>&nbsp;</p>
<p><a href="/uploads-archive/2014/01/9784534051271-B-1-L.jpg"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4131" alt="9784534051271-B-1-L" src="/uploads-archive/2014/01/9784534051271-B-1-L-207x300.jpg" width="207" height="300" srcset="/uploads-archive/2014/01/9784534051271-B-1-L-207x300.jpg 207w, /uploads-archive/2014/01/9784534051271-B-1-L-228x329.jpg 228w, /uploads-archive/2014/01/9784534051271-B-1-L.jpg 346w" sizes="(max-width: 207px) 100vw, 207px" /></a></p>
<p><a href="http://www.amazon.co.jp/%E4%B8%80%E7%94%9F%E3%81%8A%E9%87%91%E3%81%AB%E5%9B%B0%E3%82%89%E3%81%AA%E3%81%84%E3%80%8C%E8%8F%AF%E5%83%91%E3%80%8D%E3%81%AE%E6%80%9D%E8%80%83%E6%B3%95%E5%89%87-%E5%A4%A7%E5%9F%8E-%E5%A4%AA/dp/4534051271/" target="_blank">http://www.amazon.co.jp/%E4%B8%80%E7%94%9F%E3%81%8A%E9%87%91%E3%81%AB%E5%9B%B0%E3%82%89%E3%81%AA%E3%81%84%E3%80%8C%E8%8F%AF%E5%83%91%E3%80%8D%E3%81%AE%E6%80%9D%E8%80%83%E6%B3%95%E5%89%87-%E5%A4%A7%E5%9F%8E-%E5%A4%AA/dp/4534051271/</a></p>
<p>&nbsp;</p>
<p>を読みました。</p>
<p>シリコンバレーなどのワークスタイルなどはよく耳にしますが、近そうで意外と遠いこういった特定の集団のビジネスに対する考え方はなかなか耳にしたことがなく、新鮮に感じたので少しまとめてみました。</p>
<p>&nbsp;</p>
<h2>考え方</h3>
<p>◯◯になれると思っている。から焦りが無い<br />
1人でやらない。考える人、実行する人、金を出す人<br />
とりあえずやる。やりながら成功への道筋を考える<br />
失敗はない。失うのはお金だけ、勇気を失わなければ失敗でない<br />
小さな失敗の積み重ねが成功。ただ致命傷はだめ<br />
ものさしは2本。直近と未来、同時にみなければならない</p>
<h2>人</h3>
<p>できない人をあえて使う。できない人が他の人を伸ばし、できる新たな方向が見える<br />
同じ価値観の者が集まっても意味が無い。多様な発想を持った組織が強い<br />
食事を共にするのは3大欲求で唯一共有できるから<br />
貴人という考え方。それは自分を高めてくれる人。その人との出会いまでは自分を磨く準備期間<br />
嫌いな人をあえてまぜる。嫌いな人は自分と違う考え方、人脈を持っている<br />
好き、嫌いと付き合いは違う<br />
メールはエビデンスが残るから使わない。エビデンスがあれば相手を許せない<br />
教育は放置。致命傷だけは負うな。失敗は後で説明</p>
<h2>金</h3>
<p>自分の身の回りには金を使わなず周りに使う。それは周りに貯金しているという感覚<br />
徹底して純利益を計算。時間や伝票1枚まで計算する<br />
回収するお金、貸すお金、あげるお金の考え方と未来予想が明確<br />
回収する時間もお金である<br />
金は天下の回りもの。天下は大事な仲間という意味<br />
親子でもお金の貸借概念。教育は貸すであり返すことを徹底</p>
<h2>営業</h3>
<p>スケジュールを入れない。休日、時間は関係なくチャンスは一瞬<br />
大事のためにはそれ以外をシャットアウト<br />
ダブルブッキングをあえてする。マッチングさせ相乗効果を<br />
結果のためなら土下座も余裕。日本人はかっこつけすぎ</p>
<h2>ライフハック</h3>
<p>大きな声をださない。大きな声より小さな声の方が相手に届く<br />
目を見て話さない。口を見る<br />
メールは使わない。メールは最も決断が遅いツール<br />
直接会う &gt; 電話 &gt; チャット &gt; メール<br />
である<br />
昼寝をする。午前中は頭が良く働く。昼寝でそれがもう一度できる</p>
<p>&nbsp;</p>
<p>自分としては、自分と違う価値観のネットワークを築くこと、特に嫌いな人に焦点を当てているところが勉強になりました。</p>


読書感想 一生お金に困らない華僑の思考方法

<p>PCで画像をクリックしてポップアップウィンドウが出てくるhtmlですが、<br />
スマートフォンだとスクリーンが狭いから、普通にページの下部（上部）に行くつもりですが、<br />
画像をタッチしたら、ポップアップウィンドウが出てきて困ったことがあります。</p>
<p>これは、jqueryのtouchstartイベントを使うではなく、<br />
touchstartからtouchmoveイベントがあるかをチェックする工夫で解決できます。</p>
<p></p>

		<div id="crayon-64953fd59704e336696693" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">JavaScript</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
$(function()
{
	$( 'div' ).on(
	{
		'touchstart': function() {
			this.isTouch = true;
		},
		'touchmove': function() {
			this.isTouch = false;
		},
		'touchend': function() {
			if(this.isTouch == true){
				// popupイベントを発生させる
			}
		}
	});
});</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd59704e336696693-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59704e336696693-2">2</div><div class="crayon-num" data-line="crayon-64953fd59704e336696693-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59704e336696693-4">4</div><div class="crayon-num" data-line="crayon-64953fd59704e336696693-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59704e336696693-6">6</div><div class="crayon-num" data-line="crayon-64953fd59704e336696693-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59704e336696693-8">8</div><div class="crayon-num" data-line="crayon-64953fd59704e336696693-9">9</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59704e336696693-10">10</div><div class="crayon-num" data-line="crayon-64953fd59704e336696693-11">11</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59704e336696693-12">12</div><div class="crayon-num" data-line="crayon-64953fd59704e336696693-13">13</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59704e336696693-14">14</div><div class="crayon-num" data-line="crayon-64953fd59704e336696693-15">15</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd59704e336696693-16">16</div><div class="crayon-num" data-line="crayon-64953fd59704e336696693-17">17</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd59704e336696693-1"><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-t">function</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59704e336696693-2"><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-64953fd59704e336696693-3"><span class="crayon-h">	</span><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-h"> </span><span class="crayon-s">'div'</span><span class="crayon-h"> </span><span class="crayon-sy">)</span><span class="crayon-sy">.</span><span class="crayon-e">on</span><span class="crayon-sy">(</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59704e336696693-4"><span class="crayon-h">	</span><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-64953fd59704e336696693-5"><span class="crayon-h">		</span><span class="crayon-s">'touchstart'</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59704e336696693-6"><span class="crayon-h">			</span><span class="crayon-r">this</span><span class="crayon-sy">.</span><span class="crayon-i">isTouch</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-t">true</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd59704e336696693-7"><span class="crayon-h">		</span><span class="crayon-sy">}</span><span class="crayon-sy">,</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59704e336696693-8"><span class="crayon-h">		</span><span class="crayon-s">'touchmove'</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-64953fd59704e336696693-9"><span class="crayon-h">			</span><span class="crayon-r">this</span><span class="crayon-sy">.</span><span class="crayon-i">isTouch</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-t">false</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59704e336696693-10"><span class="crayon-h">		</span><span class="crayon-sy">}</span><span class="crayon-sy">,</span></div><div class="crayon-line" id="crayon-64953fd59704e336696693-11"><span class="crayon-h">		</span><span class="crayon-s">'touchend'</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59704e336696693-12"><span class="crayon-h">			</span><span class="crayon-st">if</span><span class="crayon-sy">(</span><span class="crayon-r">this</span><span class="crayon-sy">.</span><span class="crayon-i">isTouch</span><span class="crayon-h"> </span>==<span class="crayon-h"> </span><span class="crayon-t">true</span><span class="crayon-sy">)</span><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-64953fd59704e336696693-13"><span class="crayon-h">				</span><span class="crayon-c">// popupイベントを発生させる</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59704e336696693-14"><span class="crayon-h">			</span><span class="crayon-sy">}</span></div><div class="crayon-line" id="crayon-64953fd59704e336696693-15"><span class="crayon-h">		</span><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd59704e336696693-16"><span class="crayon-h">	</span><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd59704e336696693-17"><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p> </p>

Company

Our Solutions

Support

News

Blog

Blogブログ

カテゴリーから探す

年別から見る

記事一覧

2014/02/18

2014/02/14

2014/02/14

2014/02/14

2014/02/13

2014/02/13

2014/02/13

2014/02/13

2014/02/05

2014/02/05

2014/02/05

2014/02/05

2014/02/04

2014/01/29

2014/01/29

2014/01/29

2014/01/29

2014/01/29