jQueryを使った単語の絞り込み機能作成チュートリアル - MySkill Blog
MySkillでは、スキル名からユーザを検索することができます。フリーワード検索ではなく登録されているスキル名で検索するので、その単語一覧を絞り込む機能をJavaScript(jQuery)で実装しています。簡単なスクリプトなので、実装のチュートリアルとしてまとめてみました。 スキルシート/ポートフォリオの検索 方針 まず単語一覧があり、検索窓に入力すると一覧が絞り込まれていくUIを作成することが目標です。単語全てを羅列した上で絞り込むだけなので、都度検索をサーバに投げる必要がなく、JavaScriptだけで完結します。ただし単語数が多くなるとブラウザや環境によってはものすごく重くなるので、使いどころはよく考える必要があります。 HTMLの構成を決める jQueryで実装する 最適化 サンプルプログラム 欠点 HTMLの構成を決める 以下のHTMLで構成されたリストがあるとします。実際はu
竹取 JS
画面をダブルクリックで縦書きと横書きを切り替えることができます。要素を指定して縦書きにしている場合は、次回アクセス時に同じ表示が引き継がれます。 どんなサイトでも縦書きにするブックマークレット。 ↓右クリックで「お気に入り」に保存するか、リンクをドラッグしてブックマークバーにドロップします。 「縦書きにする・iPhone 用リンク」 「縦書き可能にする・iPhone 用リンク」 「段組み縦書き可能にする・iPhone 用リンク」 iPhone に登録するには？ とりあえずこのページを共有ボタンからブックマーク。 iPhone 用リンク を長押ししてコピー。 ブックマークを開いて、追加したブックマークを「編集」。 名前を「縦書き可能にする」などに変更し、URL 欄に上記コードをペースト。 最初の「http://」を削除。 注意！ やや動作が重いです！ うまく変換できなかったときは、画面をダブ
PHP、Perl、Ruby、C、C++等40以上の言語をブラウザで実行できるようになるjQueryプラグイン「Run This」:phpspot開発日誌
PHP、Perl、Ruby、C、C++等40以上の言語をブラウザで実行できるようになるjQueryプラグイン「Run This」 2010年03月11日- Run This! PHP、Perl、Ruby、C、C++等40以上の言語をブラウザで実行できるようになるjQueryプラグイン「Run This」。 ブラウザ内の<pre>コードで記述した部分を、その場でそのまま動かすことができ、うまくサイトに組み込めばより訪問者にとってわかりやすいページを作ることが出来そうです。 例えば、PHPの入門サイトなんかでは挙動を一瞬で確認できてしまいます。 具体的には以下の言語に対応しています。 Ada, Assembler, AWK, Bash, bc, Brainf**k, C, C#, C++, CLIPS, Clojure, COBOL, Common Lisp, D, Erlang, Forth
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
山口情報芸術センター［YCAM］10周年記念祭
