タグ

jqueryとjquery mobileに関するxinxのブックマーク (3)

  • jQuery Mobileを触りながら覚えよう! [Japanese Version Only] - jsdo.it - Share JavaScript, HTML5 and CSS

    サンプルを用意しました!フォークしてjQuery Mobileを体験してみよう! スマートフォンサイトをプレビューするには、エディタ画面の「Smart Phone Preview」ボタンをクリックしてください。 こんなことを試してみるとオススメ! aタグに data-transition 属性を付加するとトランジションのエフェクトを選ぶことができます。 Footer要素を画面下に固定することができます。data-position="fixed" フォーム周りの要素もjQuery Mobileで表示できます! そもそもjQuery Mobileってなんだっけ? jQuery Mobileはモバイルサイト構築のためのフレームワークです。 スマートフォンサイトやWebアプリを作成する際に利用します。 非常に手軽に利用でき、少し勉強するだけでそれなりのものが作れてしまうんですよ! ということで、j

  • [jQuery Mobile]役立つコード集とつまづきやすいポイント | コリ

    jQuery Mobileを使って、スマートフォン対応ページをはじめて作成する際に役立つコード、つまづきやすいポイントを紹介します。 10 handy jQuery mobile tips and snippets to get you started [ad#ad-2] 下記は各ポイントを意訳したものです。 スマフォ対応ページの基HTML jQuery Mobileの利用方法 AJAXナビゲーションの停止 リストアイテムの省略を阻止 Media Queriesの利用 プラットフォームの特定 フォームを使用する際の注意点 ポップアップ ダイアログの作成 キャンセルとセーブのボタン カラム構造を作る時のポイント スマフォ対応ページの基HTML まずは、スマートフォン対応ページを作成するための基となるHTMLです。 HTML <!DOCTYPE html> <html> <head> <

  • いまから始める、jQuery Mobileの基本 (1/4)

    jQuery Mobileを利用すると、簡単なHTMLを用意するだけでスマートフォンサイトを作成できます。今回はシンプルな会社案内サイトを実際に作りながら、jQuery Mobileの基的な使い方を学習しましょう。 以下のような会社案内サイトを作成します。 トップページのメニューをタップすると各ページへスライドして移動するシンプルなスマートフォンサイトです。まずはトップページ部分から作ってみましょう。 jQuery MobileとHTML5 jQuery MobileはHTML5のカスタムデータ属性でさまざまな設定を定義するので、jQuery Mobileを利用するWebページはHTML5で記述します。HTML5と聞くとハードルが高そうですが、最低限の約束ごとさえ守れば決して難しくありません。 次のようなHTMLを雛形として用意します。 <!DOCTYPE html> <html> <h

    いまから始める、jQuery Mobileの基本 (1/4)
  • 1