@thorikiriのてょりっき

@thorikiriがWebとかAndroidとかの技術ネタや本を読んだブログです

mobile

実践jQuery Mobile

を読みました。実践 jQuery Mobile作者: Maximiliano Firtman,白石俊平(監訳),牧野聡出版社/メーカー: オライリージャパン発売日: 2013/01/19メディア: 大型本購入: 1人 クリック: 1回この商品を含むブログ (5件) を見る世間ではjQuery MobileのVersion1.3が…

スマートフォンデザイン見本帳

を読みました。流し読みしました。スマートフォンデザイン見本帳作者: 矢野りん出版社/メーカー: エムディエヌコーポレーション発売日: 2012/12/26メディア: 単行本 クリック: 2回この商品を含むブログ (1件) を見るパート1では、各UIパターンごとにそれぞれ…

すべての人に知っておいて欲しいスマートフォンデザインの基本原則

を読みました。すべての人に知っておいてほしい スマートフォンサイトデザインの基本原則作者: 石本光司,いちがみトモロヲ,外間かおり,矢野りん,加藤善規,小林信次,斉藤祐也,境祐司,谷拓樹,豊沢泰尚,古籏一浩出版社/メーカー: エムディエヌコーポレーション…

jQuery UIのアイコンをjQuery Mobileで使う

jQueryMobileは便利ですよね。 少しのマークアップで、モバイルっぽいサイトが作れます。そのままでは簡素過ぎてつまらないといえばつまらないですけど。jQueryMobileでは、ボタン等にアイコンを設定することが出来るのですが、デフォルトにあるものが少ない…

jQueryMobileのダイアログの閉じるボタンのテキストが1.2でも変更出来なかった

jQueryMobileのダイアログの閉じるボタンのテキスト変更 - @thorikiriのてょりっき 前回のVersionは1.1.1で、先日1.2.0がリリースされましたが、変更出来ないようです。 4654行目のiconpos='notext'の部分を変更してもらえれば変更出来ます。 headerCloseBut…

jQueryMobile 1.2の主な変更点を簡単に

http://jquerymobile.com/blog/2012/10/02/announcing-jquery-mobile-1-2-0-final/ 詳細は読んでいただくとして、気になったところをメモしておこうかなと思いますよ。 新しいポップアップウィジェット ポップアップのウィジェットが追加されたようです。 こ…

モバイルデザインパターン― ユーザーインタフェースのためのパターン集

を読んだよ。モバイルデザインパターン― ユーザーインタフェースのためのパターン集作者: Theresa Neil,深津貴之(監訳),牧野聡出版社/メーカー: オライリージャパン発売日: 2012/09/24メディア: 大型本購入: 15人 クリック: 316回この商品を含むブログ (5件)…

HTML5のinput type="date"のplaceholderがiOSでは効かない

スマートフォンなら、HTML5に対応しているからいいよね!IEとか考えないからいいよね! と思っていた時期が僕にもありました。ありません。 iPhoneやiPad向けのアプリを作っていて、日付を入力させたい場合ってありますよね。そんな時には、HTML5で新しく追…

jQueryMobileのダイアログの閉じるボタンのテキスト変更

左上に閉じるボタンがありますよね。 でもこれって小さいので、テキストをつけたり、アイコンを変更したいなぁと思うじゃないですか。思いません?思いますよね。 色々がんばって見たのですが、簡単には出来ない。 公式のドキュメント(jQuery Mobile Docs -…

jQueryMobileでiPad向けの2カラムのWebページをデザインする まとめ

iQueryMobileを使って2カラム、(2ペイン)をデザインしてきました。 単純な画面遷移まではそれなりに実装出来たかと思いますので、ひとまずこれでまとめて、終わりとしたいと思います。 その後も色々と変更していますが、githubに上げました。まだまだ発展…

jQueryMobileでiPad向けの2カラムのWebページをデザインする その6

前回まででメニューの画面遷移が実装出来たので、今度はコンテンツ部分の実装に入ります。 こちらは、ほぼメニューと同じですね。面白みが無いです。 コンテンツを読み込む コンテンツを読み込む処理ですが、メニュー側でボタンを押された場合は戻るボタンは…

jQueryMobileでiPad向けの2カラムのWebページをデザインする その5

前回はメニューの画面遷移を実装しました。しかしながら遷移しただけで戻れないと言う致命的な欠陥がありますので、戻るボタンを実装しようと思います。 jQueryMobileでは画面遷移をURLのハッシュで管理していますね。でも2カラムだとどうしようもないので、…

jQueryMobileでiPad向けの2カラムのWebページをデザインする その4

前回までで基本的なデザインは出来上がりました。と言うことにしておきましょう。 次は画面遷移をしたいと思うのですが、jQueryMobileのデフォルトの挙動ではメニュー部分だけとか、コンテンツ部分だけを画面遷移させることが出来ないですね。 という訳で、…

jQueryMobileでiPad向けの2カラムのWebページをデザインする その3

さて、2カラムのデザイン部分だけ作りましたが、横向きだけの実装になっています。 そこで、今回は横向きと縦向きの表示を変えてみたいと思います。 とは言うもの、MediaQuery?MediaQueries?で出来ますので、CSSだけを編集しましょう。 sample.css div.ipa…

jQueryMobileでiPad向けの2カラムのWebページをデザインする その2

前回はレイアウトを組むところまででした。今回は組んだレイアウトの中にコンテンツを入れていこうとおもいます。 メニューを作る まずは、jQueryMobileのListViewを入れます。 sample.html <ul data-role="listview"> <li><a href="#">Menu-1</a></li> </ul> これはこまった、スクロール出来ませんし、ヘッダは固定…

jQueryMobileでiPad向けの2カラムのWebページをデザインする その1

なるべくネイティブ感を出したいので、jQueryMobileを使っているのですが、現状では2カラムのデザインってあんまり無いようなんですよね。 参考にしているデザインはiPadの設定アプリの画面の感じです。 jQueryMobileのバージョンは、1.1.1です。 骨組みを作…

スマートフォンUXの最前線 #webcat に行ってきました

スマートフォンUXの最前線 : ATND 2012/05/15 スマートフォンUXの最前線 #webcat - Togetterまとめ 職場が近いってもんじゃないので遅刻してません(キリッ いつも通りメモ的なものを書き残しておきます。 iOSデバイスの進化に伴うアプリ開発とデザインの変…

jQueryMobileでGoogle Adsenseを使う

ググったら、日本語の情報はiframe使うと良いよ!って書いてありまして、で、具体的にどうすんねん?と。 英語のページを見てったらコードが書いてありましたが、ココにAdsenseのコードを書きなねとしか書いてなかったので、試行錯誤しながらやってみた。 で…

jQueryMobileのpagebeforecreateでハマった

pagebeforecreateのイベントで、getJSONしてから、listview("refresh")してたんですが、getJSONの結果をlocalStorageに突っ込んで、次回以降はlocalStorageから取れば良いよね。 と思ってた時期が僕にもありました。いや、今もそう思ってるんですが、ハマっ…

jQuery Mobile スマートフォンサイト デザイン入門 (WEB PROFESSIONAL)

jQuery Mobile スマートフォンサイト デザイン入門 (WEB PROFESSIONAL)作者: 西畑一馬,鍋坂理恵出版社/メーカー: アスキー・メディアワークス発売日: 2012/02/02メディア: 大型本購入: 7人 クリック: 185回この商品を含むブログ (11件) を見るを読んだよ。 …

iPhoneアプリケーション開発ガイド HTML+CSS+JavaScriptによる開発手法

を読んだよ。 長いことカバンの中に入れっぱなしで、移動中に暇になったら読もうと思ってました。今日たまたま外出先で時間が出来たので、読み終えました。 タイトルで分かってもらえると思うけど、iOSのアプリをObjective-CとXcodeで実装する話ではありませ…

jQuery Mobile オライリー日本語版

jQuery Mobile作者: Jon Reid,渡邉真人(監訳),白石俊平(監訳),牧野聡出版社/メーカー: オライリージャパン発売日: 2011/12/22メディア: 単行本(ソフトカバー) クリック: 76回この商品を含むブログ (8件) を見る読み終えました。さっくりさっくり読み進…