Instagram検索サービスを作ってみました

Infinite Scrollを実装してみました

<p>最近はスマートフォンウェブサイトの開発に当たって、自分なりにスマートフォン（Android系2.1以上、iPhone）のUser Agentを整理してみました。<br />●User Agent<br />（Android 2.1以上）<br />アンドロイドの機種がけっこう多いです。</p>
<table border="1" cellspacing="0" cellpadding="2">
<thead>
<tr>
<th align="left">キャリア</th>
<th align="left">機種名</th>
<th align="left">UAで機種判別のため使う文字列</th>
</tr>
</thead>
<tbody>
<tr>
<td align="left">docomo</td>
<td align="left">HT-03A</td>
<td align="left">HT-03A</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SC-02B</td>
<td align="left">SC-02B</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SC-01C</td>
<td align="left">SC-01C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SH-03C</td>
<td align="left">SH-03C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">T-01C</td>
<td align="left">T-01C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">L-04C</td>
<td align="left">L-04C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">N-04C</td>
<td align="left">N-04C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SO-01C</td>
<td align="left">SO-01C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SH-12C</td>
<td align="left">SH-12C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">L-07C</td>
<td align="left">L-07C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SC-02C</td>
<td align="left">SC-02C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">N-06C</td>
<td align="left">N-06C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">F-12C</td>
<td align="left">F-12C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SH-13C</td>
<td align="left">SH-13C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SC-02C</td>
<td align="left">SC-02C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">P-07C</td>
<td align="left">P-07C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SO-03C</td>
<td align="left">SO-03C</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SO-01D</td>
<td align="left">SO-01D</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">P-01D</td>
<td align="left">P-01D</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">T-01D</td>
<td align="left">T-01D</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SC-03D</td>
<td align="left">SC-03D</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">F-03D</td>
<td align="left">F-03D</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SC-04D</td>
<td align="left">Galaxy Nexus</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SH-01D</td>
<td align="left">SH-01D</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">SH-02D</td>
<td align="left">SH-02D</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">N-01D</td>
<td align="left">N-01D</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">L-01D</td>
<td align="left">L-01D</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">F-05D</td>
<td align="left">F-05D</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">P-02D</td>
<td align="left">P-02D</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">F-07D</td>
<td align="left">F-07D</td>
</tr>
<tr>
<td align="left">docomo</td>
<td align="left">L-02D</td>
<td align="left">L-02D</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS03</td>
<td align="left">IS03</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS04</td>
<td align="left">IS04</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS05</td>
<td align="left">IS05</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS06</td>
<td align="left">IS06</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">ISW11HT</td>
<td align="left">ISW11HT</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS11SH</td>
<td align="left">IS11SH</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS11S</td>
<td align="left">SonyEricssonIS11S</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS12SH</td>
<td align="left">IS12SH</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">INFOBAR A01</td>
<td align="left">INFOBAR A01</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS11CA</td>
<td align="left">IS11CA</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS11T</td>
<td align="left">IS11T</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS11PT</td>
<td align="left">IS11PT</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">ISW12HT</td>
<td align="left">ISW12HT</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">ISW11M</td>
<td align="left">ISW11M</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS13SH</td>
<td align="left">IS13SH</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">ISW11K</td>
<td align="left">ISW11K</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">ISW11F</td>
<td align="left">ISW11F</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS11N</td>
<td align="left">IS11N</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS14SH</td>
<td align="left">IS14SH</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS12F</td>
<td align="left">IS12F</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">EIS01PT</td>
<td align="left">EIS01PT</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">IS11LG</td>
<td align="left">IS11LG</td>
</tr>
<tr>
<td align="left">au</td>
<td align="left">ISW11SC</td>
<td align="left">ISW11SC</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">X06HT</td>
<td align="left">X06HT</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">X06HTII</td>
<td align="left">X06HT</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">001HT</td>
<td align="left">001HT</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">003SH</td>
<td align="left">SBM003SH</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">001DL</td>
<td align="left">001DL</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">003Z</td>
<td align="left">003Z</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">005SH</td>
<td align="left">SBM005SH</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">006SH</td>
<td align="left">SBM006SH</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">007SH</td>
<td align="left">SBM007SH</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">003P</td>
<td align="left">003P</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">008Z</td>
<td align="left">008Z</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">009SH</td>
<td align="left">SBM009SH</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">007HW</td>
<td align="left">007HW</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">007SH J</td>
<td align="left">SBM007SHJ</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">007SH KT</td>
<td align="left">SBM007SHK</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">009SH Y</td>
<td align="left">SBM009SHY</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">101SH</td>
<td align="left">SBM101SH</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">102SH</td>
<td align="left">SBM102SH</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">009Z</td>
<td align="left">009Z</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">101P</td>
<td align="left">101P</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">101N</td>
<td align="left">101N</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">103SH</td>
<td align="left">SBM103SH</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">101K</td>
<td align="left">101K</td>
</tr>
<tr>
<td align="left">DisneyMobile</td>
<td align="left">DM009SH</td>
<td align="left">DM009SH</td>
</tr>
<tr>
<td align="left">DisneyMobile</td>
<td align="left">DM010SH</td>
<td align="left">DM010SH</td>
</tr>
<tr>
<td align="left">DisneyMobile</td>
<td align="left">DM011SH</td>
<td align="left">DM011SH</td>
</tr>
</tbody>
</table>
<p>（iPhone）<br />iPhoneだと、UAに機種を示す文字列がなくて、iOSのバージョンを示すものだけあります。<br />UAだけで、iPhoneの機種判別ができないということです。</p>
<table border="1" cellspacing="0" cellpadding="2">
<thead>
<tr>
<th align="left">キャリア</th>
<th align="left">機種名</th>
<th align="left">UAでiOSのバージョンを示す文字列</th>
</tr>
</thead>
<tbody>
<tr>
<td align="left">SoftBank</td>
<td align="left">iPhone 3G</td>
<td align="left">iPhone OS 4</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">iPhone 3G</td>
<td align="left">iPhone OS 3</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">iPhone 3GS</td>
<td align="left">iPhone OS 5</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">iPhone 3GS</td>
<td align="left">iPhone OS 4</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">iPhone 3GS</td>
<td align="left">iPhone OS 3</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">iPhone 4</td>
<td align="left">iPhone OS 5</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">iPhone 4</td>
<td align="left">iPhone OS 4</td>
</tr>
<tr>
<td align="left">SoftBank</td>
<td align="left">iPhone 4S</td>
<td align="left">iPhone OS 5</td>
</tr>
</tbody>
</table>
<p>●おまけ<br />スマートフォンでHTMLを書くときの注意点です。<br />例：headerの中に、&darr;のようなコードを書く</p>
<p></p>

		<div id="crayon-64953fd579f07379795941" 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;meta name='viewport' content='width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1' /&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-64953fd579f07379795941-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-64953fd579f07379795941-1"><span class="crayon-r ">&lt;meta </span><span class="crayon-e ">name</span>=<span class="crayon-s ">'viewport'</span><span class="crayon-h"> </span><span class="crayon-e ">content</span>=<span class="crayon-s ">'width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1'</span><span class="crayon-r "> /&gt;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>user-scalable&rarr;拡大できるか<br />initial-scale&rarr;初期拡大倍率<br />maximum-scale&rarr;最大拡大倍率</p>
<p>●参考URL<br /><a href="http://www.u-ziq.com/blog/2011/01/post_61.html">http://www.u-ziq.com/blog/2011/01/post_61.html</a><br /><a href="http://ascii.jp/elem/000/000/538/538092/">http://ascii.jp/elem/000/000/538/538092/</a></p>

Company

Our Solutions

Support

News

Blog

Blogブログ

カテゴリーから探す

年別から見る

記事一覧 - タグ: #プログラマー

2012/02/22

2012/02/16

2012/02/09

2012/02/01