cssやプログラミング

AmazonやFlickrのように、画像に範囲を指定してメモやURLを加える事が可能なjQuery-Notes

jQuery-note

Amazonのユーザーイメージや Flickrのように画像に範囲を指定 して、そこにメモやURLを加える 事が可能なjQueryプラグイン、 jQuery-Notesをご紹介します。

横に飛び出るjQueryメニュー・Horizontal Slide Out MenuをIE対応にする

IE fix

昨日書いたjQueryのメニューの Horizontal Slide Out Menuという 横に飛び出るcssメニューですが、 デフォルトではIEで表示が崩れて います。これをIEでも実装出来る ようにします。

jQuery+CSSで実装するナビゲーションメニュー総集編

css+jQuery

jQueryを使用したcssナビゲーション メニューのまとめです。フェードや スライド、滑らかにドロップダウンする、 などなど色々なメニューをまとめました。 それほど多用はしませんが、必要な 時に探すのが面倒なので備忘録的に。
Ads

cssスプライトとjQueryを組み合わせたナビゲーションメニュー・AutoSprites

AutoSprites

cssスプライトをjQueryと組み合わせて 使用するAutoSpritesをご紹介します。 軽量化できるので人気のあるcssスプ ライトにjQueryを加える事でより豊かな 表現が可能になりますね。

jQuery+cssのパネルが滑らかにスライドする、クールなドロップダウンメニュー

スライドパネルメニュー

なかなか良さそうだったのでメモ。 例によってIE6は上手く実装できて いませんでしたが、cssハックでも 使えばなんとかなるかな・・見た目 もクールで素敵なのでどこかで 使いたいです。

iPhoneやAndroidなどのモバイルアプリ紹介用Webサイトのテンプレートがなかなか良さそう

アプリ紹介サイト

開発してるけどデザインは苦手、 というモバイルアプリ開発者向け にアプリ紹介用のテンプレートが 公開されていましたよ。なかなか よさ気です。ちょっといじれば素敵 な紹介ページになりそう。

CSS3のtransformやbox-shadowを主要ブラウザ全てに対応させるjsライブラリ・cssSandpaper

cssSandpaper

これ系はいくつかありますので 1つの選択肢として、という感じ ですね。css3をIEにも対応させ るjsライブラリですが、特徴は プロパティが1行で済む点です。

IE6、7でも動作・Lightboxのようにハイライトする拡大鏡を実装するjQuery・Loupe and Lightbox

Loupe and Lightbox

なかなか用途がありそうでした のでメモ。Lightboxでよく見る ように周りを暗くして画像をハイ ライトさせながら、ルーペ機能 も実装するjQueryプラグインの ご紹介。

セレクトボックス内をマウスだけでスクロールできるjQueryプラグイン・ComboBox

ComboBox

なかなか素敵なユーザビリティ になるのでは。フォーム等で よくあるセレクトボックスを、 マウスのみでオートスクロール してくれるjQueryプラグイン。

css3で実装するドロップシャドウの応用・めくれた感じを作り出す

css3を応用

css3で新たに加えられたドロップ シャドウを使って一歩進んだシャド ウを作るTipsです。画像でよく使わ れている、めくれた際に出来る様な シャドウをcssのみで実装。

ページ内スクロールのjQueryプラグインいろいろ

ページ内スクロール

ページ内、要素間のスムースな スクロールを実装する事が可能な jQueryプラグインのメモ。使ってい るサイトも随分見かけるようになっ てきましたね。

ページ移動の必要が無くなるページング系jQueryプラグイン・Pagination Plugin

Pagination Plugin

ページングのユーザビリティを あげたいけど、オートタイプは 嫌だ、と言う方にオススメの jQueryプラグインがありました。 選択肢の一つに如何でしょう。

JavaScriptを上手くデザインに生かしたサイトのみを集めているギャラリーサイト・Not Coffee

Not Coffee

jQueryやmootools、 Prototypeなど、人気 のライブラリを駆使した サイトのみをショーケー ス化しているギャラリー、 Not Coffeeのご紹介です。

画像もjsも使わず、css+htmlだけでソーシャルメディアアイコン

Pure CSS

ちょっとしたネタ。ドラえもんやら Operaアイコンやらをcssオンリー で作られて、益々css3の可能性 が楽しみですが、今度はFlickrや Facebook、TwitterやRSSの アイコン10種をcssのみで作った 猛者が登場しましたよ。

jQueryプラグインを探す際にだいたい見て回る巡回サイトまとめ

jQuery探し

個人的にjQuery関連のブクマ が分かりにくくなってきたので 整理も兼ねてシェア。プラグ インを探す時にだいたい巡回 しているサイトをまとめます。

CSS+HTMLのみで実装出来る、クロスブラウザ対応のWebデザインテクニック集

css × クロスブラウザ

cssとHTMLタグのマークアップ のみで実装出来るテクニック集 です。クロスブラウザ対応のみ をcss-playから探したので、 ついでにご紹介します。

IEやiPhoneでも問題なく動作・ドラッグやスクロール等、多方面で応用出来るjsライブラリ・Dragdealer JS

IEでもiPhoneでも

なかなか使い勝手が良さそう だったのでメモ。スクロールバー や、コンテンツスライダーなど、 多方面で応用の効くjsライブラリ、 Dragdealer JSのご紹介。

動きがかわいいcss3+jQueryのコンテンツスライダー・Pretty Simple Content Slider

css3+jQuery

css3とjQueryを使ったコンテンツ スライダーです。動きがなかなか かわいいですよ。css3とjQuery は個人的に楽しくて色々と試したく なります。ブラウザさえ気にしなく ていいなら現場でも使うんです けどね・・

より早くcssやhtmlのコーディングが行えそうな情報いろいろ

マークアップをより早く

Web制作を少しでも効率化しよう と思って(今更)いろいろ便利そう な情報を探しました。既に使って いる情報の方が多かったのです が、折角調べたのでシェアしたい と思ってエントリーです。

jQueryプラグイン探しの時間を短縮できるかも・デモのキャプチャでギャラリー形式に紹介するJquery Labs

Jquery Labs

個人的にjQueryプラグインを探す 時に結構時間が掛かっている のでどうにかしたいと思っていま したが、なかなか素敵なサイトが ありましたのでシェア。

css3のボタンを作成出来るCSS3 Button Makerが貴方の手元に・実装ファイルが無料で配布されています

CSS3 Button Maker

CSS-TRICKSが公開している CSS3 Button Makerを構成し ているファイルが丸ごと配布 されています。ちょっと驚きで した。HTML+JSで作られてい たんですね・・

Flashのような8種のエフェクトを選べる汎用的なjQueryギャラリー・AviaSlider

AviaSlider

Flash製のギャラリーなどでよく 見かけるようなエフェクトが8種 用意されているjQueryを使った スライドギャラリーのAviaSlider をご紹介します。
Ads