人気のあるUIサンプル

• VeuJS JSONの読み込み
• フレームワークで非同期の通信ができれば大体のウェブページは作れると筆者は思っています。 そこでVue.jsでJSONを非同期で読み込む実装をやってみました。...
• 2019-07-28 15:25:15

• JS ブラウザのURLを書き換える
• JavaScriptを使ってURLを書き換えます。 jQueryで実行するボタンを作り、下記の一行を書くだけで簡単に実装できます。 $(document).ready(function(){ $('#demo_btn1').click(function() {...
• 2019-07-28 15:45:35

• TypeScript 編集とコンパイル
• TypeScriptの基本的な編集とコンパイルのメモ書きです。 TypeScriptは、コンパイルして、JavaScriptを生成する言語です。 詳しくはウィキや参考サイトをご参照ください。 TypeScriptを編集するときの基本的な作業...
• 2019-08-12 16:12:02

• jQuery メディアクエリと同様の出し分け
• CSSのメディアクエリによって、ウィンドウの幅に応じたスタイルの出し分けは、よく見かけるようになってきました。 そこで、そのウィンドウサイズに応じてJS...
• 2019-07-28 15:49:54

• jQuery フォーム入力によるフィルター
• フォームに入力された文字によって、リストの要素を出したり、消したりするサンプルです。 たくさんの要素の中から特定の要素を見つけるときに、使えるUIです。 通信もなく、単純に文字が一致するものを探し出すことができます。 appl...
• 2019-08-10 23:16:25

• d3.js 棒グラフ
• d3.jsを使った棒グラフのサンプルです。 棒グラフはなんだかんだよく使われます。 スタイルシートで成形することも可能ですが、今回はd3.jsを使って、データをもとにグラフを作成したサンプルです。...
• 2019-08-12 15:54:27

• jQuery 使ってしまいそうな非推奨のメソッド
• 廃止予定、または廃止となったjQueryのメソッドの中で気をつけておいた方がものだけピックアップしました。 現役のページで使っていたら、別のコードに差し替えた方がよさそうです。 .live() jQuery 1.7以降.on()を使えとのこと。 .die() jQuery 1.7以降.o...
• 2019-07-28 16:04:50

• VueJS タブ切り替え
• クリックしてコンテンツが切り替わる表現のサンプルです。 タブの表現はよく見かけるので、VueJSでもサンプルを実装してみました。 デフォルトは一番左のコンテンツが表示され、タブをクリックすると、コンテンツが入...
• 2019-07-28 16:08:19

• jQuery フォームをフォーカスする、はずすで発動
• テキスト入力欄をクリックして、フォーカスがあたったとき、またはフォーカスが外れたとき、発動するサンプルです。 テキストフォームを設置したら、ユーザーの入力を補助したり、促したりする機能を作るシーンがあります。 そんな時はjQueryの以下のメソッドを使うと便利です...
• 2019-07-28 16:20:27

• jQuery タブ（横・縦）
• タブとは、限られたエリアの中に、複数の情報を詰め込むときに使う便利な表現です。 クリックされたときに情報を読み込むパターンもありますが、今回は、静的...
• 2019-07-28 16:32:24