jquery– category –
-
j-9動きのあるアコーディオン
htmlでリストデザインしておく。全体のul クラスは accordion 親リストタイトルは段落とspanで囲む ↓ リストデザインはcss等で完成させておく ↓ jqwery本体読み込み ↓ jsの読み込み <script> $('.accordion p').click(function() { $('.accordion p... -
j-8ある程度スクロールしたら現れる「上へ」ボタン
→長めに作成したhtmlファイルを開く scrolltopcontrol.jsをダウンロードを実装 →「上へ」の画像を用意しておく →新規jsファイルを作成 内容は下記 //** jQuery Scroll to Top Control script- (c) Dynamic Drive DHTML code library: http://www.dynamicd... -
j-7入力フォームが空のときに入力案内を表示
htmlにテキストボックスを挿入 → index.html（新規ファイル）を開く → テキストフィールドを挿入・・・挿入→ フォーム→ テキストフィールド → inputタグ内で半角スペース→ value → 表示したい文字をいれ、JavaScript部分をinputタグ内に書き込む onFocus="... -
j-5モーダルウィンドウ
モーダルウィンドウ クリックすると表示される子ウィンドウ。また、一度開いたダイアログボックスを閉じるまで、他の操作をでき なくする CSS Modal demo ・・・シンプルでクール jsをつかわず、cssのみでできる Pop Easy Demo ・・・ポップでキュート C... -
j-4まとめる
世界を旅するカメラマンさんのサイト jQuery 様々な処理を短く簡単に書ける 先ほどのsort.htmlにcolorboxを追加 → sort.htmlを別名保存(sort++.html) → jquery.colorbox.jsを読み込む[download id="3"](済) → htmlに記述 → colorbox.cssを読み込む[downloa... -
j-3クリックで画像をグループ分け-framework-
デモページ jQuery 様々な処理を短く簡単に書ける jQueryを読み込む → 新規ファイル(sort.html)を開き<head>部分に記述 → framework.jsを読み込む[download id="8"] → cssを読み込む[download id="9"] → < body >部分にリストを記入、仮リンク... -
j-2マウスオーバーで画像の上に文字-slidemoji-
デモページ jQuery 様々な処理を短く簡単に書ける jQueryを読み込む → 新規ファイル(slidemoji.html)を開き<head>部分に記述 → htmlに記述 → cssを読み込む[download id="5"] → < body >部分に1枚画像を挿入 → マウスオーバーで表示する文字を... -
j-1クリックで画像を大きく-colorbox-
デモページ jQuery 様々な処理を短く簡単に書ける jQueryを読み込む → 新規ファイル(colorbox.html)を開き<head>部分に記述 → jquery.colorbox.jsを読み込む[download id="3"] → htmlに記述 → cssを読み込む[download id="7"] → imagesをダウンロー...
1