全6回 西畑一馬のjQuery入門（フォーム・アニメーション・Ajax編）

西畑一馬

ベストセラー『Web制作の現場で使う jQueryデザイン入門［改訂新版］』（愛称＝ドーナツ本）より、jQueryのフォーム、アニメーションを学びます。

第1回 充実したjQueryのフォーム関連機能で使いやすいフォームを作ろう

2016/10/27

0
「HTMLやCSSを操作する」という基本機能以外にも、jQueryには特別な役割を持つ機能が用意されています。その中から、｢フォーム｣に関する機能を解説します。 充実したjQueryのフォーム機能 jQueryは、商用サイトには欠かせない「問い合わせフォーム」などの制作に使える、HTMLフォームに特化した機能が充実しています。フォーム関連の機能として、 フォーム部品の値を取得・変更する命令 フォー

メンバー登録してください

いつもWPJのご利用ありがとうございます。

この記事は、読める記事数の上限に達したか、プレミアムメンバー限定のため、お読みいただけません。フリーメンバーに登録すると読める記事数を増やせます。

フリーメンバーでお読みいただけない場合は、プレミアムメンバーをご購読ください。第一人者による入門記事「LESSON」など全記事が読み放題、限定セミナー「LIVE LESSON」へもご招待します。

メンバーの方はこちらからログイン

有料会員登録で、
すべてのLESSON記事を閲覧できます
Loading...

第2回 フォームの操作に便利なイベントとセレクターを覚えよう

2016/10/31

0
jQueryの｢フォーム｣に関する機能を学びます。フォームのイベントを感知する専用の命令と、フォームの状態によって要素を選択できるセレクターの使い方を解説します。 2.フォームに関するイベントの処理 jQueryにはフォーム部品の操作によって発生したイベントを感知する命令が用意されています。他のイベントと組み合わせると、ユーザーの操作に反応するインタラクティブなフォームを実現できます。 フォームの

メンバー登録してください

いつもWPJのご利用ありがとうございます。

この記事は、読める記事数の上限に達したか、プレミアムメンバー限定のため、お読みいただけません。フリーメンバーに登録すると読める記事数を増やせます。

フリーメンバーでお読みいただけない場合は、プレミアムメンバーをご購読ください。第一人者による入門記事「LESSON」など全記事が読み放題、限定セミナー「LIVE LESSON」へもご招待します。

メンバーの方はこちらからログイン

有料会員登録で、
すべてのLESSON記事を閲覧できます
Loading...

第3回 Ajaxを使ってページを書き換えてみよう（1）

2016/10/26

0
jQueryにはAjaxを利用する機能も用意されています。「Ajax」と聞くと難しそうだし、プログラマーの仕事……と思われるかもしれませんが、jQueryならAjaxも手軽に使えますので、恐れずに挑戦しましょう。 今さら聞けない「Ajax」とは？ 「Ajax」（エイジャックス）は「Asynchronous JavaScript + XML」の略で、あえて日本語にすれば「JavaScriptとXML

メンバー登録してください

いつもWPJのご利用ありがとうございます。

この記事は、読める記事数の上限に達したか、プレミアムメンバー限定のため、お読みいただけません。フリーメンバーに登録すると読める記事数を増やせます。

フリーメンバーでお読みいただけない場合は、プレミアムメンバーをご購読ください。第一人者による入門記事「LESSON」など全記事が読み放題、限定セミナー「LIVE LESSON」へもご招待します。

メンバーの方はこちらからログイン

有料会員登録で、
すべてのLESSON記事を閲覧できます
Loading...

第4回 Ajaxを使ってページを書き換えてみよう（2）

2017/01/24

0
jQueryのAjax機能を使うと、外部のHTMLを読み込んでページ内に表示することもできます。前回に続き、jQueryのAjax機能の使い方を解説します。 load()で外部のHTMLを表示する 外部から取得するファイルがテキストファイルではなくHTMLファイルの場合も、同じくload()を使います。 たとえば、次のようなHTMLファイル（sample2_load.html）の内容を取得したいと

メンバー登録してください

いつもWPJのご利用ありがとうございます。

この記事は、読める記事数の上限に達したか、プレミアムメンバー限定のため、お読みいただけません。フリーメンバーに登録すると読める記事数を増やせます。

フリーメンバーでお読みいただけない場合は、プレミアムメンバーをご購読ください。第一人者による入門記事「LESSON」など全記事が読み放題、限定セミナー「LIVE LESSON」へもご招待します。

メンバーの方はこちらからログイン

有料会員登録で、
すべてのLESSON記事を閲覧できます
Loading...

第5回 アニメーション効果でUIに動きを付けよう（1）

2017/01/24

0
jQueryなら、Webページに動きを付ける「アニメーション効果」も手軽に実装できます。アニメーションとは言っても、HTML要素のサイズや位置、透明度を時間の経過とともに徐々に変化させ、動いているように見せるものですが、 ちょっとした「動きのあるUI」を作るには十分です。アニメーション関連の命令をサンプルとともに紹介しましょう。 非表示状態の要素を表示する show() show()は、CSSのd

メンバー登録してください

いつもWPJのご利用ありがとうございます。

この記事は、読める記事数の上限に達したか、プレミアムメンバー限定のため、お読みいただけません。フリーメンバーに登録すると読める記事数を増やせます。

フリーメンバーでお読みいただけない場合は、プレミアムメンバーをご購読ください。第一人者による入門記事「LESSON」など全記事が読み放題、限定セミナー「LIVE LESSON」へもご招待します。

メンバーの方はこちらからログイン

有料会員登録で、
すべてのLESSON記事を閲覧できます
Loading...

第6回 アニメーション効果でUIに動きを付けよう（2）

2016/10/28

0
前回に続き、jQueryのアニメーション関連機能を解説します。フェードイン・フェードアウトや独自のアニメーションを定義する方法を学び、最後にアニメーション関連の機能をおさらいします。 表示・非表示をスライドで交互に切り替えるslideToggle() slideToggle()は、toggle()のスライドアニメーション版です。セレクターで指定した要素が表示されている場合は非表示に、非表示の場合は

メンバー登録してください

いつもWPJのご利用ありがとうございます。

この記事は、読める記事数の上限に達したか、プレミアムメンバー限定のため、お読みいただけません。フリーメンバーに登録すると読める記事数を増やせます。

フリーメンバーでお読みいただけない場合は、プレミアムメンバーをご購読ください。第一人者による入門記事「LESSON」など全記事が読み放題、限定セミナー「LIVE LESSON」へもご招待します。

メンバーの方はこちらからログイン

有料会員登録で、
すべてのLESSON記事を閲覧できます
Loading...