jQuery_jquery に基づいてテキスト ボタン フォームの特殊効果を整理する

1.jQuery スライド ボタンで画像トランジション効果を制御します

スライド ボタンは、画像遷移特殊効果のソース コードを制御するために jQuery に基づいて実装されており、自動的に切り替えることができる画像が 4 つあり、切り替え時にオーバースライド効果が発生します。ユーザーは、スライドのタイトル テキストとコンテンツをカスタマイズすることもできます。非常に優れた特殊効果ソースコードです。

オンラインデモ

ソースコードのダウンロード

2.htm5 CSS3 は入力検証効果を備えたフォームの美化を実装しました

純粋な HTML5 CSS3 によるフォーム美化効果や、入力検証効果を備えたコードなど、この種の特殊効果は Web サイトで非常に実用的です。

オンラインデモ

ソースコードのダウンロード

3.ログインフォームと登録フォームを実現するためのマスク付きJquery製ポップアップレイヤー

クリックすると元のページに目的のページをポップアップ表示するコードが実装されており、さまざまなWebサイトのさまざまなページで広く使用されており、非常に実用的です。

オンラインデモ

ソースコードのダウンロード

4.DropDownList.js プラグインに基づいた jQuery のドロップダウン ボックスの美化効果

DropDownList.js プラグインに基づいてドロップダウン ボックスを美しくするコード このコードは Web サイトで非常に一般的です。

オンラインデモ

ソースコードのダウンロード

5. HTML5 と TweenMax.js をベースにしたマルチアングル回転 3D 画像アニメーション

TweenMax は非常に一般的に使用されるアニメーション フレームワークです。TweenMax.js は TweenMax の JS バージョンです。今日は、TweenMax.js と HTML5 を組み合わせて、複数の画像で壁を形成します。マウスの動きに合わせてピクチャーウォールが回転し、マウスに応じて回転速度が変化するとてもクールなHTML5 3Dアニメーションアプリケーションです。

オンラインデモ

ソースコードのダウンロード

6. HTML5/CSS3 で実装されたゴージャスな日付ピッカーのソースコード

は見た目が華やかなHTML5/CSS3カレンダーアプリで、日付の上にマウスをスライドさせると立体的な背景が表示されるのが特徴です。以前に共有された日付範囲付きの HTML5/CSS3 日付選択プラグインと比較すると、機能が若干劣りますが、全体的には依然として非常に実用的な HTML5 カレンダーです。

オンラインデモ

ソースコードのダウンロード

7. HTML5 SVG に基づくアニメーション特殊効果を実行する Fox

とてもクールな HTML5 アニメーションです。速く走るキツネです。走る動作は非常に自然で本物のようで、長いキツネの尻尾もそれに合わせて揺れます。さらに、この HTML5 キツネの走行アニメーションも SVG に基づいています。以前にも多くの SVG アニメーション効果を紹介しましたが、SVG がアニメーション制作においても大きな利点があることがわかります。

オンラインデモ

ソースコードのダウンロード

8. jQuery と MiniColors.js プラグインによって実装された Web ページの色の選択

クリックするとカラーライブラリが表示されますので、好きな色のコードを選択してください。誰かがフォームを離れて、DW または Photoshop を開いてコードを入力するのは非常に面倒なプロセスですが、この jquery プラグインを使用すると、それが可能になります。カラーコードを検索する手間を省き、必要な色を直接かつ客観的に見つけて、選択したカラーコードをデータベースに保存するだけで済みます。 .

オンラインデモ

ソースコードのダウンロード

9. jQuery によって実装されたユーザー登録フォーム上のポップアップ プロンプト テキスト効果

入力フォームの上にメモを入力するよう促すだけでなく、確認コードを入力することもできます。

オンラインデモ

ソースコードのダウンロード

10. HTML5 で実装されたパーソナライズされた回答質問。すべてのフォームが完了するまで回答を入力して、次のステップに進みます。

コードは、Web ページのどこでも使用できます。たとえば、Web サイトのホームページの先頭で、すべてのフォームに入力した場合にのみ、Web サイトのホームページにアクセスできます。同時に、フォームが入力されていない場合はスキップできません。また、質問では、採用情報に関する質問に変更することもできます。 、このコードは非常に実用的です。このコードが必要な友達はダウンロードして使用できます。

オンラインデモ

ソースコードのダウンロード