selectボックスをカッコよくスタイリングできるjQueryプラグイン「Selectric」:phpspot開発日誌
jQuery Selectric selectボックスをカッコよくスタイリングできるjQueryプラグイン「Selectric」 通常のselectをBootstrap2風やフラットな形にスタイリングすることが出来るプラグインです。 リストの中身も綺麗にスタイリングされています。 テーマも複数から選んでダウンロードが可能 関連エントリ Bootstrapのselectをカッコよくできる「Bootstrap-select」 オシャレなSelectボックスが実装できる「FancySelect」 リストをselectに変換してくれるレスポンシブサイト用jQueryプラグイン「Menutron」 selectをカッコよくしてくれるjQueryプラグイン「Minimalect」 selectボックスをインクリメンタル検索可能に機能拡張できるjQueryプラグイン「zelect」
leanModal
Strengths perfect for hidden page content uber light at just over 1kb (minified) flexible width & height image free multiple instances on one page great for login, sign up & alert panels, etc. How To Use Step 1: together with JQuery, include jquery.leanModal.min.js in your page, thusly: <script type="text/javascript" src="path_to/jquery.leanModal.min.js"></script> Step 2: rather than call another
画像を背景いっぱいに敷くjQueryプラグイン「Fullscreen Background for jQuery」
twitter facebook hatena google pocket 画像を背景に敷き詰めることでインパクトのあるデザインになります。 これを実現するのがjQuery plugin: Fullscreen Background - Gaya Designです。 ウィンドウサイズにあわせて自動でフルスクリーンで表示してくれます。 sponsors 使用方法 jQuery plugin: Fullscreen Background - Gaya Designからファイルをダウンロード。 <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="jquery.fullscreenBackground.js"></script> <script>
ページをめくる表現をつけるjQueryプラグイン「turn.js」
ページをめくるような表現付けたくなる時ありますよね。 そんな時はturn.js - The page flip effect for HTML5を利用すると簡単に実現できます。 スマホ、タブレット対応していますが、HTML5なので一部のIEには非対応です。 sponsors 使用方法 turn.jsからファイル一式をダウンロード。 <script type="text/javascript" src="/test/js/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="/test/js/turn.min.js"></script> <script> $(function(){ $('#magazine').turn(); }); </script> 上記のようにJavaScriptを記述したら、見開きなどの
WordPressブログの作成時に必ず導入しているプラグイン１０選
ソーシャル対策とSEO対策をしっかりと施すことで、アクセス数は確実に上がる。そうした観点から、以下の５つのプラグインは必須だと言える。 １．WP Social Bookmarking Lightブログに、「いいね」や「ツイート」などのソーシャルボタンを表示させるプラグインは多数あり、デザインや機能はどれも一長一短だ。その中で、総合的に考えて一番良いものが、このWP Social Bookmarking Lightだ。 これを導入すると、下図のように各種ソーシャルシェアボタンを、ブログ記事やページ上に表示させることができる。 WP Social Bookmarking Lightが良い理由は、日本人が開発したプラグインであるため、日本のインターネット事情にうまくマッチしているからだ。外国人の開発したプラグインでは、「はてなブックマーク」などの日本のサービスに対応していない。 従って、現状では
Masonry
What is Masonry? Masonry is a JavaScript grid layout library. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet. Install Download CDN Package managers Getting started HTML CSS Initialize with jQuery Initialize with Vanilla JavaScript Initialize in HTML Next MIT Lice
Creatorish is for sale at Squadhelp.com!
About Creatorish.com Edit Creatorish.com is a captivating domain name that sparks thoughts of innovation and originality. The name is a clever combination of "creator" and "ish," suggesting a creative and imaginative mindset. It's perfect for startups that focus on creativity, design, technology, and anything that involves inventiveness. The name is short, catchy, and easy to remember, making it a
企業サイトで最低限入れておきたいソーシャルに対応する為のwordpressプラグイン | さぶみっと！JAPAN
２０１２年 企業サイトもFacebookに対応する事でより多くの人にシェアしてもらいと思いませんか？スマートフォンユーザが増え、ソーシャルでシェアされる事で沢山の人に見てもらえるチャンスがあります。 このサイトは、沢山の人に見てもらえるようにするためwordpressでリニューアルしました。 wordpressには、豊富なプラグインという拡張機能があります。 そこで企業のサイトとして最低限入れておきたいwordpressプラグインの紹介です。 最低限この二つを入れておけば、現状のソーシャルには対応できます。 一つ目は、 WP Social Bookmarking Light http://wordpress.org/extend/plugins/wp-social-bookmarking-light/ このプラグインは、あなたのwordpressで構築したサイトにソーシャルボタンを簡単につ
jQuery事始めvol.3・プラグインに頼らず自分でクリックで切り替わるタブメニューを作ってみる
暫く空いてしまいましたが、jQueryを コピペに頼らず自分で書いてみよう、 という記事。第三回目です。僕よりも 全然詳しい人のほうが多いんですが、 最近何度かデベロッパーさんの憤り の発言を目にするので多少でも貢献 出来ればと思います。 というわけで第三回目はよく見るタブメニューを書いてみましょう、というもの。 「jQueryを使ったスムースなタブメニュー – ウェビメモ」という記事をお見かけしたのですが、簡単なタブメニューですのでコピペにもプラグインにも頼らず自分で作ってみようじゃないかと、そういう趣向です。 内容は完璧に良いコードとかではなく、あくまで脱ビギナーという内容となります。ビギナーの僕が何様だみたいな話は置いといて。 分かりやすさをメインにしていますので厳密には説明が少し違う点もあるかもしれません。誤解招きそうな記述ありましたらご指摘下さい。 ゴールの確認まず完成形を見てみ
パララックス効果を使った秀逸なjQueryスライダー実装チュートリアル＆サンプルDL:phpspot開発日誌
Parallax Slider with jQuery パララックス効果を使った秀逸なjQueryスライダー実装チュートリアル＆サンプルDL スライダーの背景がパララックスを利用していて画像が切り替わる際に奥行きが表現されるというものです。 サンプルのUIも超カッコいいのですが、画像が切り替わった時の奥行き感が素晴らしい。 ちょっと古い記事なんですが、知らなかったのでご紹介です デモはこちら パララックス効果を導入してみたいという方にはいいチュートリアルにもなります 関連エントリ 並べた画像を敷き詰めて超カッコよくするjQueryサンプル 円形で回転するタイマーを実装できるjQueryサンプル 良い感じで動作するニュースティッカー実装jQueryサンプル
[JS]jQueryのプラグイン100選 -2011年総集編
2011年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年はCSS3の影響もあってかアニメーションのエフェクトが目立ちました。また、Resposive Web Design用の可変ものや動画・テキストを扱ったものも多かったですね。 [ad#ad-2] 動画関連 画像ギャラリー関連 画像拡大関連 画像配置・キャプション関連 背景画像関連 コンテンツスライダー・カルーセル関連 タブ関連 ナビゲーション関連 レイアウト関連 パネル・ボックス関連 ツールチップ・ティッカー関連 アニメーション関連 エフェクト関連 スクロール操作・スクロールコンテンツ関連 リスト関連 テーブル関連 フォーム関連 テキスト関連 見出し抽出関連 ローディング関連 エレメント・コンテンツ生成 その他 動画関連
ファイルアップロード関連のjQueryプラグイン１０:phpspot開発日誌
10 jQuery File Uploading Plugins | 3D Models, Website Templates and Illustrations blog | Templates.com ファイルアップロード関連のjQueryプラグイン１０ ファイルアップロードといってもSWFを使ったりAJAXを使ったりと方法が色々あって、いろんなやり方ができるjQueryプラグインです。 望みの挙動に近いものを選んでカスタマイズすれば作りたいものが最速で作れそうですね 関連エントリ facebookのフレンズセレクタ風UIを実装できるjQueryプラグイン「fcbkListSelection」 通常のフォームを瞬時にAjax化できるjQueryプラグイン「ALAJAX」 ギャラリー等を面白く見せられるjQueryプラグイン「Minimit」
通常のフォームを瞬時にAjax化できるjQueryプラグイン「ALAJAX」:phpspot開発日誌
ALAJAX - a jQuery plugin for ajax auto form sending | Freelancer ID 通常のフォームを瞬時にAjax化できるjQueryプラグイン「ALAJAX」 フォームなんかを作る場合はAjax前提で作ったりしますが、このプラグインで $('#form').alajax(); のように初期化すれば一瞬でajax化が完了します。 もちろん、サーバ側のプログラムの調整は必要ですが、簡単にajax化できるというのはよいかもしれませんね。 やっぱりajaxフォームの速度ってはやくて利用者としては速いほうがいいわけなので、こういう風にマークアップの作り手側は簡単に対応できると作り手としては嬉しいですね。 関連エントリ Ajaxスタイルのローディングも画像を使わずピュアCSSで実現するデモ 画面遷移なしのAjaxでファイルアップロードするjQuer
XMLを超見やすく折畳み表示できるjQueryプラグイン「XML Tree」:phpspot開発日誌
XML Tree - visualise and traverse your XML | jQuery Plugins Demo XMLを超見やすく折畳み表示できるjQueryプラグイン「XML Tree」。 APIなんかでXMLはよく使うようになりましたが、XML自体を次のように折畳み可能でスタイルされたインタフェースで見ることができるjQueryプラグインのご紹介です。 ブラウザベースの味気ないXMLビューワよりも見やすい場合がありそうです。 次が実装のためのコード。描画のコードが超簡単なのもいいですね。 関連エントリ 綺麗なツリービューが実装できるｊQueryプラグイン「jsTree」 折り畳み可能なシンプルツリーメニュー実装jQueryプラグイン「Simple Tree Menu」 WindowsアプリのツリービューっぽいUIをWEB上で簡単実装できるjQueryプラグイン「jqu
ギャラリー等を面白く見せられるjQueryプラグイン「Minimit」:phpspot開発日誌
Minimit Gallery Plugin - Download ギャラリー等を面白く見せられるjQueryプラグイン「Minimit」 このギャラリー他にはない感じで次のように要素をCSS3のプロパティなんかを駆使して変形、アニメーションさせながら切り替える等のインタフェースを提供します。 デモを見てみるのが一番速いですが、とても面白いです トランプのカードを拡大するような（？）。ちょっと動きを見ていただくのが一番速そう。 リストもマウスに応じてクネクネ動きます。 クネクネ。 マウス位置に応じて拡大。 CSS3とjQueryを組み合わせることで、もっといろんなことができそうですね。 数年後にはこうしたライブラリはCSS3等を応用しまくっていて、ちょっとソース見ただけだとどうやって実装しているか、よく分からないなんていう状態になっていそうな気がします 関連エントリ PCでもスマホでもスワ
とてもとても簡単な、jQueryプラグインのつくりかた。 | Ginpen.com
こんなに短いコードですが、jQueryプラグインを作る上で忘れられない、5つのポイントがあります。 $がjQueryである事を期待しない。 jQuery.fnにメソッドを定義する。 実行コンテキストthisはjQueryオブジェクト。 .each()を使って処理する。 thisをreturnする。 他のプラグインと併用し、$がjQueryを指していない場合も考慮して、直接$は使いません。全体を無名関数にして、その引数としてjQueryを$という名前で受け取るようにしましょう。 jQuery.fnのプロパティとして関数を設置しておくと、それが$(elem)のメソッドとして呼び出せるようになります。またその際の「実行コンテキスト」つまりthisは、当然ですがメソッドを呼び出しているjQueryオブジェクトになります。このときに複数の要素を内包している場合がある（$('.hoge')を想像してく
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Blogger
ブラウザサイズに合わせて背景画像などをフィットさせるjQueryフルスクリーンプラグインいろいろ
jobyj.in
[JS]jQueryのプラグイン33+1選 -2012年1月