「jQuery Mobile」の登場で、モバイルアプリケーション開発は大きく変わる － Publickey
このところHTML5関連のモバイルアプリケーション開発について調べていて、先週の水曜日にはSwapSkills主催のイベント「jQueryモバイルで簡単！ スマートフォンサイト作成」に参加してjQuery Mobileについて勉強してきました。 jQuery Mobileとは、jQueryのプラグインとして利用するモバイルアプリケーション用のライブラリです。そしてその驚異的なまでの簡単さは、これから業務用のモバイルアプリケーションの作り方を一変させてしまう可能性を感じさせます。 jQuery Mobileの大きな特徴は次の3つです。 1）HTMLを書くだけでモバイルアプリケーションができてしまう 2）モバイルのユーザーインターフェイス対応の部品が多く揃っている 3）iOS、Android、WebOS、Windows Moblie、Symbianなどクロスプラットフォーム対応である 具体的な
jQuery MobileでiPhone用Webサイトを作成する - Pyro Memo
jQuery Mobilehttp://jquerymobile.com/ いろいろはまったので、メモ。バージョンは 1.0 ALPHA 2。 page毎にHTMLを分けて作成するこれは好みだと思うのだけど、URL直指定でそれぞれのページを呼び出せたりするようにするなら、分けた方が簡単な気がした。 構成としては、下記のような形にしてる。 html> head> link rel="stylesheet" type="text/css" href="sample_base.css" /> script type="text/javascript" src="sample_base.js">script> head> body> div data-role="page" class="user-home-page"> link rel="stylesheet" type="text/css"
jQuery Mobileでポップアップメッセージをオーバーレイ表示させる - 星屑日記
それで今取り組んでいるTumblrアプリのこぼれ話。jQuery Mobileではページロードに失敗すると、失敗したことをポップアップメッセージとして画面にオーバーレイして知らせてくれる。このメッセージ表示機能が結構便利そうなのにメソッドとして用意されてないっぽい(あったら教えてください)。自分の作っているTumblrアプリでReblogやLikeをポストしたときの成功か失敗の告知にこのメッセージ表示機能を使いたかったので、jQuery Mobileのソースコード内を探してみた。以下、該当部分をちょこっと修正したもの。jQueryがわかっていれば簡単に理解できる単純なコード。 $("<div class='ui-loader ui-overlay-shadow ui-body-b ui-corner-all'><h1>あーりんわっしょい</h1></div>") .css({ displa
jQuery Mobileを使ってiPhone用のWordPressテーマを作るTips
話題のjQuery Mobileを使用したWordPress のiPhone用テーマを作成する方法のご紹介 です。あくまで、対応させる為のTipsという事 で了承願います。jQuery Mobileは、モバイル に簡単に対応させる事が出来るライブラリで、 jQueryのプラグインです。 対応させるだけなのでcssの調整とか細かい点などはご自身で変更してみてください。 基本的に、jQuery Mobileはライブラリを読みこめばあとはdivにidを振ったり、data-theme等を加えればいいだけのようなのでテーマファイルを作るときもその手順通りで済むようですね。 細かい作り方は割愛し、ここでは大まかな手順をご紹介します。デザインに関してはjQuery Mobileのドキュメントをご確認ください。 おおまかな手順適当にWPテーマのフレームワークを用意header.phpにjQueryとjQu
jQuery Mobile ＆ a-blog cms 強化合宿資料 2010-11-18
jQuery Mobileについて jQuery MobileでiPhone対応のサンプルHTMLを作ってみた :: ハブろぐ ブログ的には、上記のエントリーで、あらかた書いてしまっていたりするので割愛。jQuery Mobileは1行もJavaScriptを書かずに、モバイルUIを適用できるすばらしいライブラリです。（まだアルファ版ですが） a-blog cms ＋ jQuery Mobile のiPhoneテーマ ( jqmobile ) ここからダウンロードできます ( acms_jqmobile.zip 8KB ) みなさんの、今回の強化合宿のおみやげにしていただければ幸いです。jQuery Mobile ＆ a-blog cmsのコラボiPhoneテーマです。 jQueryのライセンスを引き継いで、MITライセンスとしますのでこれをベースに好きなものを作ってもらってOKです。ただ
jQuery MobileでiPhone対応のサンプルHTMLを作ってみた ::ハブろぐ
気になっていたjQuery Mobileのα2が、jQuery 1.4.4と同時にリリースされたので、この機に試しに使ってみました。a-blog cmsとの組み合わせの実験も兼ねてますが、それは別エントリーで。 jQuery Mobile | jQuery Mobile jQueryおよびjQuery Mobile最新版登場 | エンタープライズ | マイコミジャーナル ASCII.jp：jQuery作者が明かす「jQuery Mobile」の魅力 デモ用のURL サンプルファイルのデモ 上記のURLにサンプルのデモを用意しました。Sencha Touchと違って、Firefoxでもそこそこ見れます。このブログにiPhone（ないしUAをそれに準じて偽装）からアクセスしても同様の表示がされます。 サンプルファイルのDL サンプルファイルのダウンロード(zip) このブログでは、CMSで動的
PhoneGapとjQuery MobileとHTML5を使ってJSONをDumpするアプリをサクッと作る - こんにちはこんにちはmonmonです！
少し前にphonegapを知ったのでJavaScriptを使ってiPhoneアプリを作ってみた。 inputにJSON APIのURLを入力するとリスト表示してくれるDumper。 monmon/dump-for-dd · GitHub 試しに作っただけなのでエラー処理とか特にしてないけど、 http://search.twitter.com/search.json?rpp=50&q=twitterみたいなのを入力して動いたのは確認した。 ブラウザでも試せるようにしたけど、こっちはAjaxで取って来れないのでtextareaにjson文字列入れてdumpできるようにしてある。 PhoneGapを使う PhoneGapのインストールはdownloadからzipファイル落として、中にあるiOS/PhoneGapLibInstaller.pkgを開くだけでおしまい。 その後はGet Starte
はじめてのjQueryMobile - Mach3.laBlog
この記事は賞味期限切れです。（更新から1年が経過しています） 先月10月にアルファリリースされ、つい先日Alpha2が公開されたjQueryMobile。 新たなモバイル向けフレームワークとして期待が高まりますが、 今日はそんなjQueryMobileを、極めてザックリと紹介してみたいと思います。 だいたいのイメージを掴んで頂ければ幸いです。 公式 : jQuery Mobile | jQuery Mobile jQueryではなく、jQueryUIのモバイル版 と、言うべきでしょうか？ jQueryMobileが提供してくれるのは、 スマートフォン向けのテーマスタイルシートと、 それをより簡単にレンダリングする為の仕組みです。 はじめ勘違いしていたのですが、 jQueryをモバイル向けにチューンした物ではないので注意。 使用の際にはjQueryを一緒に読み込む必要があります。 <link
jQuery Mobileの使い方と挙動のまとめ その１ - アークウェブシステム開発SandBox
概要 † iPhoneアプリのような挙動が、ウェブブラウズで提供できるJavaScriptのライブラリです。 iPhone以外にもAndroidやWindows Mobileなどにも対応している模様です。どれだけ対応しているかは、公式サイトの「Platforms」に書いています。 jQueryのプラグインとして動作します。 公式： http://jquerymobile.com/ この記事を書いている時のjQuery Mobileのバージョンは、「jquery.mobile-1.0a1」です。 アルファ版なので今後の改変により変更される可能性はあります。 似たもので、jQTouch などがあります。 参考： jQTouchの使い方とclass指定による挙動のまとめ ↑ 使い方 † jQueryのプラグインなので、jQueryのライブラリと一緒に読み込めばOKです。 <link rel="s
はてなブログ | 無料ブログを作成しよう
わたし的棚ぼた一万円選書 急に千葉さんに手渡された封筒、開けてみたら1万円札が1枚。何ごとかと思えば、同期の出張を代わったお礼をもらったらしい。 「葵はワンオペで育児してくれたから」と半分わけてくれました。 泡銭の1万円 これはもう、わたし的1万円選書をしろという思し召しなのでは……
はてなブログ | 無料ブログを作成しよう
新米と秋刀魚のわた焼き お刺身用の秋刀魚を買いました。1尾250円です 3枚におろして、秋刀魚のわたに酒、味醂、醤油で調味して1時間ほど漬け込み、グリルで焼きました 秋刀魚のわた焼き わたの、苦味が程よくマイルドに調味され、クセになる味わいです 艶やかな新米と一緒に 自家製お漬物 土…
はてなブログ | 無料ブログを作成しよう
新米と秋刀魚のわた焼き お刺身用の秋刀魚を買いました。1尾250円です 3枚におろして、秋刀魚のわたに酒、味醂、醤油で調味して1時間ほど漬け込み、グリルで焼きました 秋刀魚のわた焼き わたの、苦味が程よくマイルドに調味され、クセになる味わいです 艶やかな新米と一緒に 自家製お漬物 土…
はてなブログ | 無料ブログを作成しよう
わたし的棚ぼた一万円選書 急に千葉さんに手渡された封筒、開けてみたら1万円札が1枚。何ごとかと思えば、同期の出張を代わったお礼をもらったらしい。 「葵はワンオペで育児してくれたから」と半分わけてくれました。 泡銭の1万円 これはもう、わたし的1万円選書をしろという思し召しなのでは……
はてなブログ | 無料ブログを作成しよう
新米と秋刀魚のわた焼き お刺身用の秋刀魚を買いました。1尾250円です 3枚におろして、秋刀魚のわたに酒、味醂、醤油で調味して1時間ほど漬け込み、グリルで焼きました 秋刀魚のわた焼き わたの、苦味が程よくマイルドに調味され、クセになる味わいです 艶やかな新米と一緒に 自家製お漬物 土…
jQuery Mobile Alpha1触ってみました – transition編 « SMART LAB
スマートフォン,smart phone,Windows7,iPhone,Android,iPadもう一週間以上前の話ですが、ついにjQuery Mobile アルファ版がリリースされました。 HTML5のカスタムデータ属性を指定するだけで簡単にページを構成することができます。 <div data-role="page" id="foo"> <div data-role="header"> <h1>1ページ目</h1> </div> <div data-role="content"> <ul data-role="listview"> <li><a href="#bar" data-transition="slide">1</a></li> <li><a href="#bar" data-transition="slideup">2</a></li> <li><a href="#bar"
jQuery Mobile Alpha1触ってみました – Event編 « SMART LAB
スマートフォン,smart phone,Windows7,iPhone,Android,iPad昨日に引き続き jQuery Mobile です。 本日は各種イベントについて。 jQuery Mobile では、タップしたとか右にシュッとやったとかデバイスの向きが変わったとかそういったスマートフォン固有のイベントが special events で実装されています。 残念ながらドキュメントは準備中のため、ソースコードを見ながらサンプル作りました。 間違いや抜けがあったらごめんなさい。 今回のサンプル イベントは scrollstart, scrollstop, taphold, tap, swipeleft, swiperight, swipe, orientationchange の八種類あります。 $('#box').bind({ tap: function(){ $(t
jQuery Mobile の NestedList で JSON データを動的にリスト表示 - なんとなくな Developer のメモ
以前、jQTouch 等で作成したもの（iUI版 id:fits:20100715, jQTouch版 id:fits:20100731, SenchaTouch版 id:fits:20101005）と同様のサンプルを jQuery Mobile で作成してみました。（サーバー側の処理も同じものを使用） jQuery Mobile 1.0 a1 ただし、今回のサンプル（静的HTML版も含む）のようにリストアイテムにアンダースコア "_" を含む名称が使われる場合（例 information_schema）、Firefox では正常に動作しますが、Safari では「Error Loading Page」が表示され次の画面に遷移できなかったので注意。（Android エミュレータでも同じ現象が発生） 原因は調査してませんが、jQuery Mobile が自動生成する ID に問題ありかも。（
jQuery Mobile Alpha 1 がリリース！触ってみた - へっぽこプログラマーの日記
先日ついにjQuery MobileのAlpha版がリリースされました。 http://jquerymobile.com/2010/10/jquery-mobile-alpha-1-released/ 少し触った内容と簡単な使い方を説明します。 Demos and Documentation http://jquerymobile.com/demos/1.0a1/ 1.準備 現時点では、jQuery Mobileの動作には最新のjQuery1.4.3が必要です。 ダウンロードしたjQuery MobileとjQueryを一緒に読み込みます。 <link rel="stylesheet" href="jquery.mobile-1.0a1.css" /> <script src="jquery-1.4.3.js"></script> <script src="jquery.mobile-1.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
はてなブログ | 無料ブログを作成しよう
ブログ – H2O space
