[JS]不可視のDOMをコントロールしてUIを拡張するスクリプト -Shadow UI
tooltip ツールチップ Shadow UIの使い方 Step 1: 外部ファイル まずは、ベースとしてhead内にjquery.jsと当スクリプトを外部ファイルとして記述します。 <script src="/shadow-ui/assets/js/jquery.js"></script> <script src="/shadow-ui/js/shadow.js"></script> スタイルシートはベースとなるファイルとそれぞれ用のファイルが用意されています。 <link rel="stylesheet" href="/shadow-ui/assets/css/main.css"> <link rel="stylesheet" href="/shadow-ui/css/ui.css"> <link rel="stylesheet" href="/shadow-ui/css/ui-dr
アニメーションしながらソートできるjQueryプラグイン「Animated Table Sorter」:phpspot開発日誌
jQuery Animated Table Sorter アニメーションしながらソートできるjQueryプラグイン「Animated Table Sorter」。 ソート可能なテーブルを実現するjQueryプラグインはよくありますが、アニメーションするのははじめてかも。 どこからどこに移動したか？という部分が分かりやすく、一瞬でソートされてしまうテーブルよりもカッコ良いだけではなく使い勝手もよさそう 関連エントリ シンプルにテーブルにソート機能を持たせるだけのjQueryプラグイン「jQuery Table Sort」 テーブルを簡単にカッコよくスタイリングできるjQueryプラグイン「tablecloth.js」
Amebaっピグっぽい物が作れるjQueryプラグイン「pp3Diso」:phpspot開発日誌
Plugin pp3Diso : moteur de jeu web pour l'affichage et la gestion d'une map 3D isomtrique Amebaっピグっぽい物が作れるjQueryプラグイン「pp3Diso」。 マップ上を人が移動するような感じのゲーム風インタフェースが作れるライブラリっぽいです。 フランス語っぽいので翻訳したりコードを読んだりして使う必要がありますが、なかなかおもしろいのでご紹介。 JavaScriptベースということで、スマホで動くAmebaピグを作ってやろう、という方は参考にできるかも。 関連エントリ ２Dゲームが作れそうなアニメーションjQueryプラグイン「Motio」 カスタマイズ可能で動きがよいalertダイアログ実装jQueryプラグイン「alertifyjs」 Instagramの写真をサイトに簡単掲載できるjQ
Retinaディスプレイ判別で自動で高解像度画像を出しわけ可能な単独ライブラリ「Retina.js」:phpspot開発日誌
Retinaディスプレイ判別で自動で高解像度画像を出しわけ可能な単独ライブラリ「Retina.js」 2012年04月12日- Retina.js | Retina graphics for your website Retinaディスプレイ判別で自動で高解像度画像を出しわけ可能な単独ライブラリ「Retina.js」 <img src="/images/my_image.png" /> という画像タグがあったとするとスクリプトがサーバ上の"/images/my_image@2x.png"というファイルを自動でチェックして存在すれば置き換えてくれます。 インストールはretina.jsを読み込むだけというお手軽さがいいです。 単に高解像度で出したい部分だけファイルを用意して置いてあげればよいというのはお手軽ですね。 <script type="text/javascript" src="/s
これは超使いやすいページネーションの次世代UI:phpspot開発日誌
Slider Pagination Concept - with jQuery UI Slider これは超使いやすいページネーションの次世代UI。 普通、リストページのページネーションといえば、「 1 , 2, 3, 4 ,5 次へ> 」みたいなUIが基本ですが、そもそもこのUI疑ってかかってもいい時期なのかも。 要は現在のページ番号と、ページを前後と、ページ指定で送れればいい、という要件を満たせばいいわけでもっとシンプルに出来るはず。 今回紹介するページネーションのデモ ページ番号の部分はボタン風になっているので押してみましょう。 するとスライダーになってドラッグ＆ドロップでページ指定が簡単に出来ます。 30までドラッグ＆ドロップして話すと30ページ目が開く、というようなイメージ 次へ、前へ、といった直感的に分かりやすいボタンも実装されていて必要十分。 従来のページネーションは作る場合
とてもとても簡単な、jQueryプラグインのつくりかた。 | Ginpen.com
こんなに短いコードですが、jQueryプラグインを作る上で忘れられない、5つのポイントがあります。 $がjQueryである事を期待しない。 jQuery.fnにメソッドを定義する。 実行コンテキストthisはjQueryオブジェクト。 .each()を使って処理する。 thisをreturnする。 他のプラグインと併用し、$がjQueryを指していない場合も考慮して、直接$は使いません。全体を無名関数にして、その引数としてjQueryを$という名前で受け取るようにしましょう。 jQuery.fnのプロパティとして関数を設置しておくと、それが$(elem)のメソッドとして呼び出せるようになります。またその際の「実行コンテキスト」つまりthisは、当然ですがメソッドを呼び出しているjQueryオブジェクトになります。このときに複数の要素を内包している場合がある（$('.hoge')を想像してく
jQuery Clip - jQueryのプラグインをまとめました。
jQueryの便利で実用的なイメージスライダーやレスポンシブ対応のプラグインをタグやカテゴリで見やすくまとめました。
目次のナビゲーションを自動生成してくれるjQueryプラグイン「TOC」:phpspot開発日誌
TOC | jQuery Table of Contents Plugin 目次のナビゲーションを自動生成してくれるjQueryプラグイン「TOC」 H1等のヘッドラインが綺麗に定義されているサイトであれば次のような目次のサイドバーが自動で付けられます スクロールすればカレントの目次にカーソルが移動するあたりもクール 自分で作っていたらコンテンツの追加毎にいちいちナビゲーションもいじらなくてはいけないので便利ですね 関連エントリ ページの目次ナビゲーションを自動で作ってくれるjQueryプラグイン「AutoAnchors」
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
IDEA * IDEA