なかなか良さそうだったのでメモ。 例によってIE6は上手く実装できて いませんでしたが、cssハックでも 使えばなんとかなるかな・・見た目 もクールで素敵なのでどこかで 使いたいです。 マウスオーバーすると右側は横へスライドしてパネルがドロップダウンします。アニメーションはjQueryで実装しているみたいなのでIE7,8等でも滑らかに動いてくれます。css3で動かしてるとIE全部だめですからね・・ Large Drop Down Menu 見た目も素敵。ドロップダウンしてくるメニューもデザインされているのでなかなか使う場面もありそうです。IE6では表示が崩れていましたが、動きそのものは実装出来ていたのでcssだけ対応すればなんとかなりそうな予感です。 マウスを乗せていない状態です。普通のメニューですが、マウスを乗せることで項目がスライドしますよ。ユーザーにとっても分かりやすそうですね。 j

ver. html 5 Last Update：2010.02.19 要旨 この文章は、XHTMLとCSSを用いてWebサイトをコーディングする際のガイドラインを示すものです。 このサイト自体が、ガイドラインに則った、サンプルファイルとして作成されています。 コーディングはHTML5にて行っておりますが、内容はHTML4に準じております。 HTML5が勧告され次第、順次アップデートする予定です。 INDEX 更新履歴 2010.02.18

CSS3 Transitions Collection 30 Safari4で閲覧してください。Chromeは3Dがきかないので対応してないのもあります。Firefox, IE, Operaなどでは閲覧できません。

Catch404 ? A jQuery And CSS3 Modal Plugin For Handling Broken Links Elegantly | AddyOsmani.com | Where Web Businesses Grow 移動する前に404かどうか確認できるjQueryプラグイン「Catch404」。 クリックした後に404ページが表示されるのではなく、クリックしたタイミングで404かどうかチェックしてダイアログを出してくれるプラグインのご紹介です。 外部サイトにリンクしている場合、404かどうかっていうのはアクセスしてみないとわかりませんが、jQueryがajaxで通信して存在チェックをして、飛ぶかどうかを決定することが出来ます。 リンク切れだった場合に次のようなダイアログをだしてくれます。 初期化は次のように簡単。チェックしたいものだけを catch404メソッ

jQuery Raty - A Star Rating Plugin 可愛い感じの星型レーティングが簡単に実装できるjQueryプラグイン「Raty」。 星のイメージがデフォルトでファンシーな感じになっています。 画像の切替や細かなカスタマイズもオプションを渡すことで簡単に実施できるみたいです。 関連エントリ jQueryとCSS3を使ったカラフルなレーティングシステムのサンプル JavaScriptでスターレーティングを行うライブラリやサービス色々 WordPress用の記事レーティング付け用プラグイン色々

CSS3のボックスシャドウを内向きにし、画像の四辺をぼかしたエフェクトにするスタイルシートを紹介します。 CSS の box-shadow を使った画像輪郭のぼかし デモページ 対応ブラウザはChrome, Safari, Firefox, Operaで、IEは非対応とのことです。下記はFirefoxでのキャプチャです。 全体のキャプチャ 当サイトの記事「画像の四辺のボーダーを一味違ったスタイルにするチュートリアル」が参考になったとのことで、嬉しい限りです。 昨日、紹介したIEをCSS3対応にする「CSS3 PIE」がbox-shadowもサポートしているのでやってみましたが、insetへの対応は未なのかな、残念。

ナビゲーションのホバーに合わせて、Google Mapsとパネルの表示を切り替えるスクリプトを紹介します。 <textarea name="code" class="html" cols="60" rows="5"> <li data-geo-lat="41.9786" data-geo-long="-87.9047"> <h3>O'Hare Airport</h3> <p>Flights n' stuff</p> <p class="longdesc"><strong>About:</strong> O'Hare International Airport has been voted the "Best Airport in North America" for 10 years by two separate sources: Readers of the U.S. Edition

Kick-ass CSS3 Support in IE6, 7, and 8 | AEXT.NET MAGAZINE IE6-8でもCSS3に対応するライブラリまとめ。 IEでCSS3に対応するには behavior で htcを指定する方法が簡単で便利ということでライブラリが色々あるようだったのでまとめました。 そんなに多機能はいらないという場合に、機能を削ったものを使うという方法もありかもしれません。 CSS3 PIE 角丸、ドロップシャドウ、グラデーション背景等、多くのプロパティに対応していて今後も対応を強化 IE-CSS3 border-radius、box-shadow、text-shadow等のプロパティが使えるようになる。いかがスタイリング例 css3shadow.htc テキストに影をつけるためのhtc curved-corner - Project Hosting on

Webブラウザにおいて、JavaScriptで window.open() の戻り値は、開いた子ウインドウオブジェクトの参照です。 var win = window.open(”url”, "windowName"); // win は子ウィンドウオブジェクトの参照 子ウィンドウからは、 window.opener で親ウィンドウオブジェクトを参照することができます。 また、ウィンドウ名からウインドウオブジェクトを参照することもできます。 Gecko DOM リファレンスの window.open には、ウィンドウ名からウインドウオブジェクトを参照する方法が記載されています。 url に空文字列を与えることは、ウィンドウのロケーションを変えずに、その名前によって開いたウィンドウの参照を得るための手段です。 window.open – Gecko DOM リファレンス たとえば、Windo