Flashを超えた、かもしれない文字列アニメーション:phpspot開発日誌Decorative Letter Animations | Codrops Flashを超えた、かもしれない文字列アニメーション 超えたかどうか、というのは正直どうでもいいのですが、Flashと遜色ない、数年前であれば、Flashであることを疑わなかったかもしれない程のクオリティのアニメーションが実現されています 関連エントリ 文字別にインタラクティブなアニメーションをつけた面白サンプル テキストを切り替える際に面白いアニメーションが使える「jquery-bubble-text」
JavaScriptでURL書き換えを便利にするユーティリティライブラリ「url.js」:phpspot開発日誌
url.js JavaScriptでURL書き換えを便利にするユーティリティライブラリ「url.js」 特定のパラメータを追加・更新・削除したり、URLの組み立て等、他の言語でも欲しいぐらい便利なライブラリです 追加・更新・削除も１つの関数を覚えてしまえば実現できるところが覚えやすくてよさそう 関連エントリ JavaScriptベースのOAuth認証ライブラリ「hello.js」
スクリーンサイズに応じてフォントサイズを変更できるjQueryプラグイン「fontFlex」:phpspot開発日誌
NathanRutzky/jQuery.fontFlex GitHub jQuery.fontFlex スクリーンサイズに応じてフォントサイズを変更できるjQueryプラグイン「fontFlex」 最小、最大、標準のフォントサイズを指定しておけばスクリーンに応じて自動でフォントサイズを調整してくれて便利そう。 body全体、その他、特定エレメントのみ対応することも可能 関連エントリ レスポンシブで何でも埋め込めるLightBox実装jQueryプラグイン「VenoBox」 インライン編集できるテーブル実装用jQueryプラグイン「editable-table」 複数RSSをjQueryでアグリゲートして1ページに表示できるjQueryプラグイン「jQuery Feeds」 ドラッグ＆ドロップで画像をUPできるようにするjQueryプラグイン「JQuery File Uploader」 se
レスポンシブで何でも埋め込めるLightBox実装jQueryプラグイン「VenoBox」:phpspot開発日誌
VenoBox - responsive jQuery modal window plugin レスポンシブで何でも埋め込めるLightBox実装jQueryプラグイン「VenoBox」 LightBox派生スクリプトは多々ありますが、レスポンシブでクールなフラットデザインで、地図、動画、画像、iframeなどなんでも埋め込めるので、今の時代にかなり使いやすそう。 関連エントリ フラットデザインが美しいレスポンシブなLightbox「Nivo Lightbox」 動画/地図/画像のポップアップが可能でレスポンシブなLightBox実装jQueryプラグイン「MagnificPopup」 スワイプできるLightBox実装jQueryプラグイン「Swipebox」 LightBoxはここまで進化したよ「VisualLightBox」
Bootstrap用、横スライド式メニュー等の追加コンポーネントが使える「Jasny Bootstrap」:phpspot開発日誌
Bootstrap用、横スライド式メニュー等の追加コンポーネントが使える「Jasny Bootstrap」 2014年01月13日- Jasny Bootstrap Bootstrap用、横スライド式メニュー等の追加コンポーネントが使える「Jasny Bootstrap」。 通常のBootstrapだとスライドダウンする形式のメニューがレスポンシブで実装されますが、トレンドである、横スライド式のメニュー等が実装できるBootstrapの追加コンポーネント集です。 メニュー以外にもボタンやナビゲーション用メニュー、フォーム入力補助機能等が拡張されていてどれも使いやすそう。 横スライド式メニュー 拡張ボタン 併せて使えば便利ですね。本家にインクルードされてもよさそうな質です。 関連エントリ フリーで使えるフラットでハンサムなBootstrapテンプレ集「Black Tie」 Bootstrap
Bootstrap用のフォームバリデーター実装jQueryプラグイン「BootstrapValidator」:phpspot開発日誌
Bootstrap用のフォームバリデーター実装jQueryプラグイン「BootstrapValidator」 2014年01月15日- nghuuphuoc/bootstrapvalidator GitHub Bootstrap用のフォームバリデーター実装jQueryプラグイン「BootstrapValidator」 BootstrapなサイトでのJSベースでのフォームバリデーションを実装できます。 Emailやクレジットカード等のよく使いそうなバリデーションや長さチェック等一般的なものまで実装されています。 リアルタイムバリデーションで使い勝手をよくしたい場合の１つの選択肢として覚えておいても良さそう 関連エントリ Bootstrapなサイトで使える星形レーティングプラグイン Bootstrap対応でレスポンシブなWYSIWYGエディタ「Summernote」 フリーで使えるフラットでハ
コンテナに画像をフィットさせられるjQueryプラグイン「imagefill.js」:phpspot開発日誌
imagefill.js | Project Page コンテナに画像をフィットさせられるjQueryプラグイン「imagefill.js」 HTMLの指定した位置に画像をフィルさせたい場合に使えます。 次のように、画像を特定サイズのブロックに適度に拡大させておさめられます。 それ用の画像を作る必要はもうなく、動的にフィットさせられるというのは便利でレスポンシブWEBデザインにも使えます 関連エントリ 製品画像等のズームが非常に簡単に行えるjQueryプラグイン「Image Zoom」 画像のカーソル位置を拡大できるjQueryプラグイン「mlens」 マウスホバーだけの簡単操作で画像をズームできて便利な「jQuery Zoom」
もっと読む、を簡単に実装できるjQueryプラグイン「Readmore.js」:phpspot開発日誌
もっと読む、を簡単に実装できるjQueryプラグイン「Readmore.js」 2013年07月22日- Readmore.js: jQuery plugin for long blocks of text もっと読む、を簡単に実装できるjQueryプラグイン「Readmore.js」。 ブログ等でよくある、「ReadMore」。クリックすることで全文が見れるような物ですが、サーバサイドでやるとリロードが必要。 jQueryで$(element).readmore() ってやればすぐにテキストを短くしてくれるところが便利そうです。 クリック時のアニメーションなんかもできます。地味だけど便利ですね 関連エントリ selectをカッコよくしてくれるjQueryプラグイン「Minimalect」 タブ切り替え時のエフェクトがクールなタブUI実装jQueryプラグイン「Tabulous.js」 サ
フリー＆プレミアムなTwitterBootstrapテーマ50:phpspot開発日誌
50 Awesome Twitter Bootstrap Templates フリー＆プレミアムなTwitterBootstrapテーマ50 Bootstrapベースとはいえ、Bootstrap臭があまりしないテンプレートが多数まとまっています。 通常サイトや管理画面等のテンプレートがまとまっていて、活用してサクっと仕事を終えられる事もあるかも Bootstrapの便利さを享受しつつ、うまくサイトデザインする際の参考にもできそうです 関連エントリ Bootstrapのselectをカッコよくできる「Bootstrap-select」 BootStrapのフォーム入力をもっと便利にするための「Bootstrap Form Helpers」 BootstrapをベースとしたフリーのUIKit「Flat UI」 Bootstrapに270の使えるアイコンを追加できる「Elusive icons」
LightBoxはここまで進化したよ「VisualLightBox」:phpspot開発日誌
jQuery Image Lightbox: Prime Time DEMO LightBoxはここまで進化したよ「VisualLightBox」 CSS3等を使ってかなりオシャレに進化したLightBoxが実装できます。LightBoxはもう８年ぐらいまえに登場して、今オリジナルをみるとなんか古い感じがするということで時の流れを感じます クリックするとオシャレに拡大。 テーマが大量にあって好みのデザインを選びたい放題 Windowsっぽいスキン。LightBoxが出たのってポップアップを禁止するツールが多く出てきたことが背景にありますが、ページ内ポップアップされていて面白い。 関連エントリ スワイプできるLightBox実装jQueryプラグイン「Swipebox」 今こそ知っておくLightbox風プラグイン20+
HTMLメール用のレスポンシブテンプレート「Antwort」:phpspot開発日誌
Antwort | Responsive Layouts for Email HTMLメール用のレスポンシブテンプレート「Antwort」 HTMLメールを送る際に、メールクライアントに併せてレスポンシブに動くみたい。 float対応していないクライアント向けにtableタグを使う等しているところが、他のレスポンシブフレームワークと違うところ メールでのマーケティングに活用したいところですね 関連エントリ レスポンシブなiPhoneのサイドメニューっぽいメニューが作れるjQueryプラグイン「Sidr」 レスポンシブなCSSベースのドロップダウンメニュー「Top Drawer」 レスポンシブな日付ピッカー実装jQueryプラグイン「pickdate.js」 最初からレスポンシブなCSSデザインのHTMLテンプレート３５ レスポンシブなテーブル作りに役立つjQueryプラグイン「FooTab
Twitter製の高速なオートコンプリート用JSライブラリ「typeahead.js」:phpspot開発日誌
typeahead.js Twitter製の高速なオートコンプリート用JSライブラリ「typeahead.js」 ハードコードデータとリモートのデータを両方サジェストできたり、サジェスト部分のテンプレートをいじったりできるみたいです。 オートコンプリート用ライブラリは数あれど、Twitter社製ということで、一度試してみたいものですね Twitterが出すことによって成功したBootstrapですが、こうした高品質な物が使えてしまうのはありがたいことですね 関連エントリ Google風のBootstrapテーマ「GoogleBootstrap」 Bootstrapに270の使えるアイコンを追加できる「Elusive icons」 Bootstrapで矢印を描くのなら「Bootstrap Arrows」 TwitterBootstrapベースのWYSIWYGエディタ「bootstrap-wy
Google,Facebook,Twitter,Tumblr等のAPIを簡単に扱える機能豊富なPHPライブラリセット「Eden」:phpspot開発日誌
Google,Facebook,Twitter,Tumblr等のAPIを簡単に扱える機能豊富なPHPライブラリセット「Eden」 2013年01月08日- Eden PHP Library Google,Facebook,Twitter,Tumblr等のAPIを簡単に扱える機能豊富なPHPライブラリセット「Eden」。 Youtubeやカレンダー、Google+等のGoogleサービス他、ソーシャルサイトのAPIを使った機能を簡単かつ綺麗なコードで実装できる他、PHPのSessionやCookie、String等のコードをオブジェクト指向で扱えるようにする機能などが提供されます。不要な物はダウンロード時にチェックボックスを外して排除することも可能 例えば、ライブラリを使えば、次のようなコードによってGメール経由でメール送信することが可能。 メール送信にかぎらず、Facebookのフレンドを
Bootstrapに270の使えるアイコンを追加できる「Elusive icons」:phpspot開発日誌
Elusive icons, an icons font designed for use with Bootstrap Bootstrapに270の使えるアイコンを追加できる「Elusive icons」 Bootstrap標準アイコンも140種類と豊富に使えますが、これに270種類を追加すれば、アイコンにはもう困らないかも。 Bootstrapを使っている方、使おうと思っている方は是非覚えておきたいですね。 ベクター形式なので拡大してもOK。 今後、アイコンはBootstrap対応をデフォルトにしてくれるとよりBootstrapが素晴らしい物になっていきそうですね。 関連エントリ Bootstrapで矢印を描くのなら「Bootstrap Arrows」 TwitterBootstrapベースのWYSIWYGエディタ「bootstrap-wysihtml5」 Twitter BootSt
Bootstrapで矢印を描くのなら「Bootstrap Arrows」:phpspot開発日誌
Bootstrap Arrows Bootstrapで矢印を描くのなら「Bootstrap Arrows」 全国の矢印好きの諸君。こんにちは。もうPhotoshopで矢印を描いて画像を作ってアップロードなんていうことは必要ない。 <span> に簡単なclassをつけるだけで、向きも、長さも、色だって、自由自在。 しかも、次のような美しい矢印が描画できる。センス云々の話ではなく、class="arrow" として rel で角度を指定するだけで美しい矢印が描けるのだ。 色んなUIライブラリはあれど、矢印まで描けるとなるともう選択肢は限られる。 これでBootstrapを使わない理由は一切なくなったのだ。 関連エントリ TwitterBootstrapベースのWYSIWYGエディタ「bootstrap-wysihtml5」 Twitter BootStrap に追加できる５つのコンポーネント
Lightbox JSを拡張したLightbox Plus:phpspot開発日誌
Lightbox Plus LightBox JSを拡張させたLightbox Plusライブラリの紹介。 ウィンドウサイズより大きい画像でも、丁度良いサイズにして表示してくれます。 更に左上に表示される最大化ボタンを押すことでオリジナルのサイズにサイズ変更可能。 LightBox JSを拡張させた、もう一つのライブラリ、Lightbox Jojoもシャレが聞いていてとってもナイスです。 ジョジョの奇妙な冒険っぽく「ドドド」「ドッギャーン」と画像を表示させることが出来ます。
指定した要素を直接していしてLightBox風表示させられるjQueryプラグイン「Lightbox_me」:phpspot開発日誌
指定した要素を直接していしてLightBox風表示させられるjQueryプラグイン「Lightbox_me」 2010年05月31日- Lightbox_me - Stupidly Simple Lightboxing 指定した要素を直接していしてLightBox風表示させられるjQueryプラグイン「Lightbox_me」。 通常、LightBoxというと、画像や動画などをポップアップで表示する際に用いられます。別ページを開く場合にもiFrameを使ったりして実現されますが、このプラグインは少し違います。 <div id="hogehoge">hogehoge</div> という要素があったとすると、$("#hogehoge").lightbox_me(options) のようにすることで、指定した要素自体をLightBox風に表示させられます。 このプラグインを使うことで、予めHTM
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Bootstrapのポップアップ機能を拡張できる「ggpopover.js」:phpspot開発日誌
HTMLテーブルを JSON、XML、PNG、CSV、PDFなどあらゆる形式に変換できる「HTML table Export」:phpspot開発日誌
フリーのiOS7アイコン800個セット:phpspot開発日誌