制作した(制作中)のウェブページをiPhone, Android, iPad, Kindleなどスマフォやタブレットのビューポートのサイズでエミュレートして表示するレスポンシブ対応サイト制作時に役立つjQueryのプラグインを紹介します。 rFrame -GitHub rFrameのデモ rFrameの使い方 rFrameのデモ まずは、下記のようなデスクトップ用のページがあるとします。 デモでは、これをスマフォ・タブレットのサイズにエミュレートして表示します。
iPhoneやiPadのタッチイベントに 対応させるjQueryプラグインです。 軽量なんですが、jQueryUI併用な ので一応軽量とは謳わないように しておきます。導入も結構簡単 なので覚えておいて損は無いかも。 iPhoneやiPadでドラッグやリサイズを可能にするライブラリです。もちろんiPhoneだけでなく、PC側でも動かせます。 ただ、要素をドラッグしたりリサイズしたり、だけではなくドラッグ可能なコンテンツをネストしたりドラッグコンテンツ内にスライダー入れたりとかも出来る。 試しにjQueryMobileと併用しました。サンプルどうぞ。QRコードも用意しときました。 sample 使い方 <script src="http://code.jquery.com/jquery-1.7.0.min.js"></script> <script src="http://code.jque
無償のWebサイト構築ツール「WebMatrix 2」、新版はiPhone/iPadエミュレータ、Node.js、CoffeeScriptなど対応 先週末に行われたWindows Azureの新機能を紹介するイベント「Go Azure」の基調講演の中で、Azure以外に興味を引かれたソフトウェアがありました。マイクロソフトが無償で公開しているWebサイト構築ツール「WebMatrix」の新版、「WebMatrix 2」です。 WebMatrixは、HTML/CSS/JavaScript/PHP/ASP.NETなどに対応したエディタ機能を備え、コード補完機能も搭載。ローカルにデータベースやWebサーバを用意してPHPの動作をそのまま確認したり、WordPressやDrupalなどのWebアプリケーションをローカルで試すこともできました。 下記はその画面(参考:マイクロソフト、無償のWeb開発
How to Identify an Apple iPhone, iPod or iPad Visitor to Your Website iPhoneかiPodかiPadかを調べるPHPとJSのソースコード例が公開されています。 先日もiPad判別コードという似たようなエントリを紹介したのですが、参考になるという方もいたようなのでご紹介。 iPhoneとiPodとiPad、それぞれ、AppleWebKitが使われていますが、バージョン番号が異なってます。 まあ、わかりやすいのですが、iPad、iPhone、iPodがUAに入ってくるのでそれを判別するだけになります。 サイト上のJS、PHPコードもiPad/iPhone/iPodの文字列を調べているだけのようですが、ちゃんとやりたいという方は正規表現を使ってやるとよさそうですね。 関連エントリ iPad用のサイト作成に覚えておくこと色々
早いもので今年も残すところあとわずか となりました。今年は年をまたいで仕事 しないとならないので早めに総まとめ的 な記事を書いておきます。と言っても 完全に自分用のまとめですのでご覧に なっても役に立たないと思いますがw というわけで、後で復習するのに、探さなくていいようにしただけの自分用リンク集です。 jQueryとWordPressにやたら偏ってます。過去記事のまとめですので目新しいものは一切ありません。 ネタは省いてます。あと、種類で細かく分ける気力が残ってないので順不同です。 スマフォ向けが多いのでスマフォ関連は※印を振っておきました。 復習用なのでリンクは全て当サイトの記事にしてます。他の方には二度手間ですがご了承下さい マウスを乗せるとキャプチャが表示されます。 130個くらいです。普段から小ネタばっかりなのでそんな感じのまとめです。 【追記】(僕が)リンク見にくいので色を変え
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く