Archive for 8月, 2008

iPhoneでJavaScriptを使わずCSSだけでアニメーションする方法

2008/8/13 水曜日 Posted in iPhone | No Comments »

iPhoneはJavaScriptを使わなくても、CSSのみでアニメーションができるようです。 今回はその方法をご紹介します。 サンプルとして、ボタンを押すと赤い四角が右にツーっと動く、というものを例に解説しようと思います。 この赤い四角が 「move right」ボタンを押すことで、右にアニメーションします   サンプルのHTMLは次の通りです。 <html> <head> <meta name="viewport" content="width=320, user-scalable=no, maximum-scale=1.0" /> <style type="text/css"> .slide { -webkit-animation-name: "slide-right"; -webkit-animation-duration: 2s; } @-webkit-keyframes "slide-right" { from { left: 10px; } to { left: 190px; } } </style> <script type="text/javascript"> function slideStart() { document.getElementById("target").className = "slide"; document.getElementById("target").style.left = '190px'; } </script> </head> <body> <input type="button" name="hoge" ... Read more..

PerlでCPANモジュールを組み合わせてモバイルサイトを作る方法を紹介するプロジェクト「MobileCat」

2008/8/12 火曜日 Posted in 記事紹介・リンク | 1 Comment »

本日は、PerlでCPANモジュールをさまざま組み合わせてモバイルサイトを作る方法を紹介するプロジェクト「MobileCat」をご紹介します。 →　MobileCat　トップページ [mobilecat.koneta.org] →　Elementary, ... CPAN モジュールを使って楽に携帯サイトを作る方法 （紹介ページ） [e8y.net] →　tomi-ruのモバイル日記　ブログで告知した　（作者tomi-ruさんのブログ） [hatena.ne.jp]   このMobileCat （http://mobilecat.koneta.org/） のページ自体がデモサイトとなっており、Perlのフレームワーク「Catalyst」を使って作られています。 名前の由来は、Mobile + Cat[alyst] なので「MobileCat」とのことです。 ケータイから見たところ   特に参考になるのは、「ソース逆引き」のページです。 →　MobileCat　ソース逆引き [mobilecat.koneta.org] 機能面から見たソースと利用モジュールを参照できるため、とてもわかりやすいです。 Perlを使ってモバイルサイトを作成しようと考えている方は要チェックではないでしょうか。 ロゴのネコがかわいいです   関連： Perlでの絵文字の相互変換についてまとめたスライド資料「use Encode::JP::Mobile;」 YAPC::Asia 2008の発表で使われたスライド資料「OpenSource TypePad Mobile」 携帯サイト作りの基本がまとめられた「Perlで作るモバイルサイトのコツ」 Read more..

iPhone向けサイト作成のベースに便利なテンプレート集「iPhone Universal」

2008/8/11 月曜日 Posted in iPhone | 1 Comment »

本日は、iPhone向けサイトを作成する際に、ベースとして利用できそうなテンプレート「iPhone Universal」をご紹介します。 →　Google Code　iphone-universal [code.google.com]   「iPhone Universal」は、iPhone向けのページを作成するためのサンプルとなるHTML, CSSのテンプレートです。 ライセンスはGPL v3で公開されており、リストやボタン、フォームやパネルなど、一通りのサンプルが収録されています。 シンプルなリスト 入力フォーム パネル   上記画像はネイティブアプリではなく、すべてHTMLとCSSを使って作られたiPhone風インターフェイスです。 なお、こちらにサンプルもアップしてみましたので、iPhoneをお持ちの方はどうぞご確認ください。 →　iPhone Universal デモ   関連： 90秒で理解するiPhone JavaScript（ジェスチャー編） iPhone用JavaScriptデータベースプログラミング入門(JavaScript++かも日記) 90秒で理解するiPhone JavaScript（マルチタッチ編） Read more..

PHPで携帯位置情報を扱うライブラリ「Geomobilejp_Converter」（ウノウラボ）

2008/8/8 金曜日 Posted in 記事紹介・リンク | No Comments »

ウノウラボさんで、PHPで携帯位置情報を扱うライブラリための「Geomobilejp_Converter」が公開されていますのでご紹介します。 1週間くらい前にリリースされたものなのですが、紹介するタイミングを逸してしまい、すっかり遅くなってしまいました。 →　ウノウラボ　PHPで携帯位置情報を扱うライブラリ「Geomobilejp_Converter」を作りました [unoh.net]   以下公開ページからの引用です。 日本のモバイル端末のGPS機能で送信される情報を想定した、緯度経度フォーマット、測地系の相互変換ライブラリです。また、緯度経度からdocomoの提供するオープンiエリアのエリアコードやエリア名を取得することができます。 例えば、「位置情報付きで掲示板に書き込む」などの機能を簡単に実装することができます。 フォーマットや測地系の変換は、GPS系のプログラムを作る際にはほぼ必ず必要になりますし、緯度経度からエリア名が取得できるという機能も便利ですね。 PHPのバージョン5で動作し、ライセンスは「New BSD License」とのことです。   なお、GPSによる緯度経度の取得をサポートするライブラリとして、「Net_UserAgent_Mobile_GPS」というものもあります。 位置取得プログラムの作成をお考えの方は、こちらも合わせて確認してみてはいかがでしょうか。 →　GPS PEARライブラリ / Net_UserAgent_Mobile_GPS [mgps.org]   関連： 3キャリア対応の位置取得API「シリウス GeoPlatform API」を使ってみました ケータイで取得した位置情報を世界測地系に変換するサンプル ケータイで取得した位置情報をGoogleMap形式に変換するサンプル Read more..

ドコモ用にCSSをインライン化してくれるPHPライブラリ「toInlineCSSDoCoMo」がバージョンアップ

2008/8/7 木曜日 Posted in 記事紹介・リンク | No Comments »

以前ご紹介した、ドコモのCSSをインラインに埋め込む形に自動変換してくれるPHPライブラリである「toInlineCSSDoCoMo」がバージョンアップしたようです。 →　アシアルブログ　toInlineCSSDoCoMoをバージョンアップしました [asial.co.jp]   以前書いた紹介記事はこちらです。 →　ドコモのCSSをインラインに埋め込んでくれるPHPライブラリ「toInlineCSSDoCoMo」 →　ドコモのCSSをインラインに埋め込んでくれるPHPライブラリ「toInlineCSSDoCoMo」(続き)   ケータイサイト構築の中で、大きな課題となっているのが、ドコモ端末が外部CSSの読み込みに対応していないという点です。 この「toInlineCSSDoCoMo」を利用することで、外部CSSを自動で「style="xxx"」形式に置換してくれますので、ケータイサイトのHTML作成がぐっと楽になります。 今回のバージョンアップでは以下の点が修正されたとのことです。 内部での変換をUTF-8で行うように 数値文字参照と実体参照を実行時にエスケープ XML宣言の逆転現象を回避するように修正 エラー処理モードを追加し、strictモードのときのみ例外を投げて、それ以外の時は無視するように 私はお盆前進行により、まだ試せていないのですが、前回のバージョンで問題となっていた箇所の多くが改善されているようですね。 手が空きましたらすぐに活用したいと思います。 また上記ブログによると、ソフト名がイケてないとの指摘をうけたらしく、変更を考えているとのことです。 ステキなネーミングに期待したいと思います。（←プレッシャー）   関連： ドコモのCSSをインラインに埋め込んでくれるPHPライブラリ「toInlineCSSDoCoMo」 ドコモのCSSをインラインに埋め込んでくれるPHPライブラリ「toInlineCSSDoCoMo」(続き) 絵文字ライブラリ「sfPictogramMobilePlugin」がバージョンアップし、PEARパッケージ化されたようです Read more..

« Previous Entries
Next Entries »