画像にマウスホバーするとズームする拡大鏡っぽいやつを簡単に実装できる2KBの軽量jQueryプラグイン・loupe 結構良かったのでご紹介。ECサイトとか で見かける、マウス乗せると画像が拡大 するやつです。拡大鏡とか言えばいいん でしょうか?ニーズはそこそこありそう ですし、かなり軽量で導入も簡単なので 覚えておくと工数減らせるかもですね。 ...2012.03.21 | 10時12分58秒jQueryWebデザイン
Pinterestっぽいレイアウトを作ってみる 以前、レンガ風に要素を配列するレイ アウトを凄くよく見かけるようになり、 それから一種のブームのように様々な リソースが出回りました。最近はあま り見かけなかったのですが、Pinterest の登場で、また似たようなレイアウト ...2012.03.19 | 11時07分41秒jQueryWebデザイン
ベジエ曲線のラインに沿ってテキストを折り返すことができるjQueryプラグイン・Bacon! ちょっと面白いプラグインだったので 備忘録。曲線に沿ってテキストを折り 返せるようにするjQueryプラグインで す。新聞のようなレイアウトも組めそ うです。用途はあまり無さそうですけ ど、珍しいので覚えておきたい。2012.03.18 | 11時59分38秒jQueryWebデザイン
WordPressの投稿画面で、記事のカテゴリーを1つしか選べないようにする 少々気になった記事があったので備忘録。WordPressの投稿画面でカテゴリーを選択出来る部分があって、そこはチェックボックスになっています。当然複数選べるようになっているわけですが、仕様上、1つしか選べないようにしたい、という場合のTip...2012.03.15 | 12時44分17秒jQueryWordPressカスタマイズ
ブログのフッター等にjQueryでTumblrに投稿した画像を表示する よく、ブログのフッターやサイドバーに Flickrに投稿した写真が表示されていた りしますが、これをTumblrでやりたい、 っていう場合の方法。jQueryとTumblrの APIで表示します。Tumblrユーザーさんの 方が自...2012.03.13 | 10時59分26秒jQueryWebデザイン
背景いっぱいに画像を表示、スライドショー化にも対応した軽量なjQueryプラグイン・BACKSTRETCH 同じようなの沢山あるのですが、 軽量って言葉に弱い。背景一杯 に画像を表示、スライドショー 化も可能なjQueryプラグインで す。圧縮版なら2KBほどですの で導入しやすいですね。2012.03.11 | 10時13分44秒jQueryWebデザイン
jQueryでグローバルメニュー内のリストから「現在のページ」のURLを持ったリストにclassを加える グローバルメニュー内のリストの中で 現在のページの部分にclassを与える事 で今いるページだけをスタイリングする 事が出来ます。静的なサイトなら手作業 で済みますが、CMSとかASPになると、その 中のルールに依存するので少し厄...2012.03.10 | 11時50分54秒jQueryWebデザイン
Media QueriesとjQueryを使って、スマートフォンでアクセスした時だけナビゲーションメニューを上に隠す シンプルで良かったので一応メモ。レスポ ンシブWebデザインのTipsです。Media Queries とjQueryを使用して、スマフォでアクセス した時だけ、邪魔になりがちなナビゲー ションメニューを上に隠す、みたいな手段。 ...2012.03.07 | 11時06分33秒iPhone / iPadjQueryWebデザイン
jQuery UIのデザインをオリジナルに変更したサンプル 分かりやすいタイトルが思い浮かばない ので適当な感じになりましたが。jQuery UIのデザインをちょっと今風に変更した サンプルが配布されていたので備忘録。 jQuery UI、凄く機能的で良いんですが、 用意されているデザイン...2012.03.06 | 9時58分14秒cssやプログラミングjQueryWebデザイン
jQuery Mobileのリストでデフォルトの高さのリストにサムネイルを高さ一杯に含める ちょっと意味不明なタイトルですが。 jQuery Mobileでリストを書くときの Tipsです。昨日ちょっと個人的に話題 に上がったのでメモ的に記事にします。 最近はすっかりJQMの話題が減っていた ので丁度いいですね。2012.03.02 | 13時14分31秒iPhone / iPadjQueryWebデザイン
郵便番号や地名を入力するだけでGoogleマップ検索できる地図コンテンツをjQueryで作る ちょっと便利そうなライブラリがあった ので備忘録。Googleマップでキーワード や郵便番号を入力するだけで、該当する 場所を表示します。ちょっと場所を確認 したい、みたいなシーンは地味にありま すし、これは手軽に実装出来るので覚...2012.03.01 | 11時34分21秒jQueryWebデザイン
レシポンシブWebデザイン対応のツールチップを実装するjQueryコード 日曜日ですね。まだまだ寒い日が続き ますが如何お過ごしでしょうか。今日 もレスポンシブWebデザイン関連。いい 加減飽きられそうですね。今日はツール チップですのでさほど需要は無いもの と思われます。ただ、簡単に実装出来る ので...2012.02.26 | 11時05分39秒iPhone / iPadjQueryWebデザイン
要素をレンガ風に配列するスクリプト・jQuery Masonryで、配列させる要素を下揃えにする 要素をレンガ風に配列するjQueryプラグイン のMasonryで、要素を下揃えに配置出来るよ うにしたい、という内容です。オプション 項目を追加してオンオフを出来るようにカス タマイズします。下揃えにする機会があるか どうかは置...2012.02.24 | 10時30分14秒jQueryWebデザイン
その場でサクッとiPhoneやiPad等の幅でWebサイトの表示確認が出来るレスポンシブWebデザインの補助用ブックマークレット・Resizer ここ何日かずっとレスポンシブWebデザイン のネタが続きますが・・便利なブックマーク レットです。閲覧中のWEBサイトをiPhoneや iPadの幅で見たときの表示状態で確認出来る ブックマークレットです。というか単純に リサイズ...2012.02.16 | 10時14分47秒iPhone / iPadjQueryWebデザイン
簡単なjQueryコードで動く、レスポンシブWebデザイン対応のカルーセルを実装する為の雛形っぽいやつを作成してみる レスポンシブWebデザインに対応できる コンテンツスライダーのようなものの 雛形のようなものが欲しかったので、 自分で作成しました。テンプレなので 他の配布スクリプトのように親切な 設計じゃないですけど・・2012.02.15 | 11時26分21秒jQueryWebデザイン
「パス」を定義して、スクロールに応じて曲線を描くようなアニメーションを実装出来るjQueryプラグイン・Scroll Path 過去に何度か出ている、スクロールに応じて 要素がユニークな動きをするプレゼンを実装 出来るjQueryプラグイン。今日のプラグイン は、Photoshopやイラレなんかでお馴染みの ペンツールによるパスを定義できる、という もので...2012.02.11 | 11時09分49秒jQueryWebデザイン
どんな要素でも全画面表示に出来るFullscreen APIをブログの記事に使ってみる ※動作サンプル有 どんな要素でも全画面表示に出来る Fullscreen APIというものがありま して、主に動画で使われている事が 多いですが、今回はブログコンテン ツのリーダビリティに貢献させる 目的で使って見ます。2012.02.07 | 11時09分03秒cssやプログラミングjQueryWebデザイン
HTML5製のWebサイト向けUIフレームワーク・Kendo UIモバイル版の日本語サンプル作った 以前ご紹介した、HTML5製のWebサイト 向けUIフレームワーク・Kendo UIの モバイル版に触ってみたついでに 日本語化してサンプルにしました。 まだベータ版みたいなので、実用 段階では無さそうですが。2012.02.06 | 11時01分51秒iPhone / iPadjQuery
ページ内に「しおり」を付けられるシンプルなjQueryプラグイン・youRhereで「後で読む」ユーザーに配慮する 便利そうだったのでご紹介。ページ内に栞 を付けられるjQueryプラグインです。栞は 行単位で付けられて、次アクセス時には自動 でスクロールしてくれます。長文コンテンツ やドキュメントサイトなんかには積極的に 導入して欲しいなぁ、...2012.02.03 | 11時14分17秒jQueryWebデザイン
連続した要素を分割してページネーションを実装、移動時にエフェクトを加えるjQueryプラグイン・jPages ちょっと珍しいタイプでしたので備忘録。 連続した要素を、指定した数に達したら 分割して、ページネーションを自動で 生成し、移動時にエフェクトが加わえる、 というもの。大量のリストをコンパクト に、という方に向いてそうですね。2012.02.02 | 11時01分11秒jQueryWebデザイン
[書評]jQuery Mobile スマートフォンサイト デザイン入門 ASCII様よりご献本頂きました。書評を 持って御礼とさせていただきます。よ うやく正式版がリリースされたjQuery Mobileですが、まだまだ実践向けの 情報の書かれたブログ記事なども少な いですが、こちらはかなり実践向け...2012.01.31 | 10時59分35秒cssやプログラミングiPhone / iPadjQueryプライベート個人的な日記
jQueryによる背景のスライドショーを手軽に実装出来るWordPressプラグイン・Site Background Slider Webサイトの背景に画像をいっぱいに 広げて、jQueryでスライドショー化、 というのを手軽に実装出来るWordPress のプラグインです。jQueryとWPでよく 困ってる方を見かけますのでプラグイン に頼るのも手かなと思い...2012.01.30 | 11時14分04秒jQueryWordPressプラグイン