今回もタブレット端末に関するニュース、皆さんの質問・回答をお届けします。
あなたの疑問解決のヒントになればいいのですが。
写真拡大
前回の画像ビューワーをそのままiPhone、iPad、Androidに対応させましょう。
サンプルを見るサンプルは、第13回で使ったサンプルを改造して、スマートフォン・タブレットで動作する用に作り変えました。
今回のサンプルは、教材用にシンプルなコードになるように、スマートフォン用のコードしか入れていませんのでiOS・Android OS搭載の、スマートフォン・タブレットのみでしか動作しません。
サンプルの動作を確認する際は、必ず対応端末でご覧ください。
前回のサンプルでは、「mousedown」「mousemove」「mouseup」イベントを利用しましたが、これらのイベントを利用したドラッグ＆ドロップ処理は、スマートフォンOSではうまく動作しません。
そこで、スマートフォンOS用には、専用のイベントで対応することになります。
そもそもスマートフォンOSは、指で動作する様に作られているので、当然指での操作に即したイベントが用意されています。
それが、「touchstart」「touchmove」「touchend」の各種イベントです。
「touchstart」は、画面にタッチした時、「touchmove」は、タッチ後、指を動かしたとき、「touchend」は指を画面から放したときに発生します。
つまり、前回マウスイベント系で処理していた部分を、全てタッチ系のイベントに置き換えてしまえばいいのです。
HTMLのソースは前回と全く一緒なので、マウス系のイベントとタッチ系のイベントの実装方法の違いを解説します。
まず、タッチ系のイベントは、jQueryのイベント追加処理の「bind」を使うより、JavaScriptのデフォルトの「addEventListener」で実装した方が色々と都合がいいです。
なので、$(”#container”).mousedown(startFunc)；$(document).mousemove(moveFunc)；$(document).mouseup(endFunc)；を、$(”#container”)[0].addEventListener(”touchstart” , startFunc)；$(document)[0].addEventListener(”touchmove” , moveFunc)；$(document)[0].addEventListener(”touchend” , endFunc)；この様に書きます。
$(”#container”).addEventListener(”touchstart” , startFunc)；上のような書き方だと、jQueryには、「addEventListener」というメソッドは無いためエラーになってしまいます。
「addEventListener」は、必ずHTMLオブジェクトで実行しなくてはいけません。
しかし、通常jQueryのセレクタで取得すると、一旦jQueryオブジェクトという、HTMLオブジェクトを内包したjQuery専用のオブジェクトにしてしまいます。
ですので、「addEventListener」や、その他JavaScript標準メソッドや、あるブラウザ特有の処理を行う場合は、jQueryオブジェクトから、HTMLオブジェクトを取り出す必要があります。
そこで一番簡単なやり方が、「 $(”#container”)[0] 」なのです。
jQueryでは、HTMLオブジェクトを、セレクタで取得した数分、配列で保持しています。
なので、ひとつしかエレメントが無い場合（id属性など）は、[0]番目を取得すればいいのです。
これで、HTMLでタッチを扱う準備が出来ました。
それでは次に、タッチイベントのイベントハンドラを定義しましょう。
タッチイベントで、タッチした座標を取得するにはe.touches[0].pageX；と、します。
「e.touches」で、タッチ自体を取得できるのですが、「 e.touches[0].pageX； 」このように、配列のインデックスを渡しています。
実は、スマートフォンのタッチイベントでは、タッチオブジェクトは複数存在します。
何故かというと、スマートフォンは複数の指での操作（マルチタッチ）に対応しているため、JavaScriptのタッチイベントも、マルチタッチ前提で実装されているからです。
12次へ>>li.twitter iframe.twitter-share-button { width:100px!important;}button { display:block; }コメント0ツイート!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
http://news.livedoor.com/article/detail/7177033/
※この記事の著作権は配信元に帰属します。
----------------------------------------------
higurasinonakukoroni928さん
タブレット端末についての質問です。
タブレット端末の購入を考えています。 わたしは、大きさは5インチ～8インチくらいまでで価格が１００００～４００００くらいまでのがいいです。性能とかわからないのでその辺も教えてください。 インターネット観覧や動画サイトの再生、音楽、動画などをすることをいろいろなアプリなどをしたりするのをしたいです。
ベストアンサーに選ばれた回答
ebihopさん
はじめまして、二台目としてgalaxyTabを使っています。
GalaxyTabは7インチと片手で持てるサイズですし、
価格も現在キャンペーン中なので
比較的安価で手に入れる事ができますよ。
【総評】
私は非スマートフォンとGalaxyTabの二台持ちで使ってますが、
GalaxyTabはとってもオススメです♪
特にTabを持ってて良かったなぁと感じたのは、
先日の東北地方太平洋沖地震です。
携帯の電池は切れてしまったけれど、
Tabは翌日昼に帰宅するまでずっとバッテリーが持ちました。
また電話で安否確認が取れない知人とは、
Tabを使ってtwitterやskype、SNS上で連絡を取る事ができました。
【デザイン】
シンプルで美しいです。
裏は白いので指紋が目立ちにくく、
汚れもすぐ取れます！
【携帯性】
確かに、缶コーヒーほどの重さがあるので、
女性が片手で持つにはずっしり感はあります。
しかし、タブレット端末の中では優れていると言えるのでは無いでしょうか。
通学中や外出先でも大画面でWEBやアプリが楽しめるので、
これ以上大きすぎても小さすぎてもいけない丁度よい大きさだと思います♪
【ボタン操作】
何も不自由していないので★５つ。
私は、この動画と同じBluetooth対応のキーボードを購入し、使っています。
(http://www.youtube.com/watch?v=aC9meq1jHOs)
【文字変換】
何も不自由していないので★５つ。
【レスポンス】
私はiPadも持っているのですが、
やはりApple製品と比べると若干レスポンスは劣ります。
(iPadやiPhoneの反応は半端なく良いですからね…)
比較すると若干劣るので★４つにしましたが、
今のところスムーズに使えています。
【メニュー】
標準的なアンドロイドのメニューです。
カスタマイズ可能なので、
自分に合ったメニューにすることができます。
ガジェットも色々な種類があって
壁紙を変えたりカスタマイズするのが楽しいですよ～。
【画面表示】
画面が大きくてWEBもアプリも綺麗に見れます。
電子書籍を読むにも丁度よい大きさです。
電子書籍を読んでる動画を見つけたので貼っておきます。
(http://www.youtube.com/watch?v=lno67Unjac0)
【通話音質】
私は二台目としてGalaxyTabを持っており
あまり通話機能は使わないので無評価とさせていただきました。
ちなみに通常はハンズフリーなので周囲の人にも通話内容がダダ漏れです。
しかしイヤフォンマイクを使って通話する事が可能です。
私は、skypeの時はハンズフリーで通話し、
通常の電話はイヤフォン使って通話してます。
【呼出音・音楽】
これもあまり使っていないので無評価とさせていただきました。
目覚ましの音楽が豊富で、設定するのが楽しかった覚えがあります。
【バッテリー】
バッテリーの持ちの良さは、この携帯の売りでもあります！
一般的な携帯が800～1300ミリアンペアなのに対して
GalaxyTabはなんと4000ミリアンペアもあります。
一日一回は充電するように心がけていますが、
使っていなければ三日持つこともありました。
***
参考までに
GalaxyTabの機能や使い方を紹介している
■GalaxyTab専門Youtubeチャンネル
http://www.youtube.com/user/samsungmobilers3d/
■GalaxyTab&Androidアプリ紹介ブログ
http://blog.livedoor.jp/samsungmobilers3_d/
を載せておきます^^
http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q1157656191
※この記事の著作権は配信元に帰属します。
意外と多かった財布の中のカード、平均8.8枚……最大はなんと47枚！
http://headlines.yahoo.co.jp/hl?a=20121126-00000056-rbb-ent
いかがでしたか？
また次回をお楽しみに。