IE6
[CSS]imgタグの画像をborder-radiusで角丸にして表示する方法
以前にCSS3 のborder-radius で角丸を作る方法の記事でもborder-radiusの基本的な使い方を紹介させていただきましたが、今回は「画像の四隅を角丸」にして表示させる方法のご紹介です。 画像を角丸で表示させる <img>...
[JS]画像や動画、iframeもLightbox風に立ち上げるjQueryプラグインColorboxの使い方
画像をオーバーレイで拡大表示できるスクリプトとして、Lightbox はよく使いますが、動画やinline コンテンツ、iframeなどもLightbox 風に表示させるにはjQueryプラグインColorboxが便利です。 カスタマイズし...
[CSS]CSSでフッター要素をブラウザ下部に固定する方法
コンテンツの情報量が少ないページでは、フッター要素がページ中段くらいまで上がってきて見栄えが良くない場合もあるので、フッターは常にブラウザの下部に固定させる方法をまとめました。 CSS でフッター要素をブラウザの下部に固定 まずはHTMLで...
[IE]IE6でもmin-width、min-height、max-width、max-heightを使う方法
IE6ではCSSの「min-width」「min-height」「max-width」「max-height」が効かないため、javascriptなどを利用して別途対応してあげる必要があります。 今回紹介させていただくminmax.jsは、...
[WP]IE6やIE7でのアクセス時にアラートメッセージを表示できるプラグインIE6 No More
当ブログでは、IE下位バージョン向けの特別な対応(動作チェックも)はしていませんため、WordPressプラグインIE6 No More」というプラグインを利用して、IE7以下で閲覧させた際にページ上部にアナウンスを表示しております。 ちな...
[IE]PIE.htcを利用したIE8以下向けの表示サンプル
IE6、IE7、IE8でも一部の CSS3のプロパティが使える「PIE.htc」の記事でも紹介させていただいたPIE.htcファイルですが、実際にIE6、IE7、IE8でPIE.htcを使った場合の見え方はどのようになるのか について、サン...
[JS]IE6でも:hover疑似クラスが使えるなどHTML/CSS表示を調整するIE用ライブラリIE7.js
IE6 でも:hoverや:first-childの一部擬似クラスを使えたり、透過PNGの画像が使えるなど、ちょっと便利かも知れないライブラリIE7.js。 今回はそのIE7.jsの設置方法から、IE7.jsを使って何か出来るのか?を簡単に...
[JS]IE6でも滑らかなロールオーバーを実現させるにはsmoothRollOver.jsが便利
リンク画像にマウスを乗せると滑らかなロールオーバーを実現させることができるjavascriptがsmoothRollOverです。 ロールオーバー前と後の2種類の画像を用意して、smoothRollOverのファイルを<head>内に読み込...
[CSS]角丸をIE8以下でも利用できるようになるborder-radius.htcの使い方と注意点
IE8以下のバージョンで「角丸」を実現させる方法は、PIE.htc や IE-CSS3.htc などを使う方法もありますが、今回紹介させていただく border-radius.htc を使う方法もあります。 名前の通り border-rad...
[IE6]Youtubeの埋め込み動画をIE6に対応させる方法
Yotube動画を自分のサイトやブログに貼付ける場合、iframe版のスッキリしたタグを使いたい所ですが、 これだとIE6で動画が見えない… ので、企業サイトを中心にYoutube動画をIE6でも見れるように対応する必要がある場合は「以前の...
[IE]IE6、IE7、IE8で角丸やドロップシャドウなどを利用できるIE-CSS3.htc
以前に紹介させていただいた PIE.htcファイルと同様、IE6、IE7、IE8 でも CSS3 のプロパティを利用できるファイルが「IE-CSS3.htc」です。 PIE.htcと基本的な使い方は同じですが、利用できるプロパティが若干変わ...
[CSS]IE6、IE7、IE8、IE9別のCSSハック一覧
IE6〜9用にそれぞれ個別にスタイルを適応させたい場合のCSSハックのまとめです。 よく忘れるので、個人的な備忘録もかねてのご紹介です。 IE6 IE7 IE6 + IE7 IE8 IE6 + IE7 + IE8 IE9
[IE]IE6でも疑似クラスの:hoverを使う方法のまとめ
IE6 では疑似クラスの :hover が <a> タグ以外では使いないので、IE6対応として「ビヘイビア」と「Javascript のライブラリ」を使って hover をIE6でも利用する方法をまとめてみました。 csshover.htc...
[IE]IE9だとIETesterで「印刷」「印刷プレビュー」など一部正常に動かない機能がある模様
IETesterを使ってIEチェックしていると、「印刷」「印刷プレビュー」が正常に動作しない…と少しハマりました。 いろいろを調べているとこんな記事が紹介されていました。 IE9が入ってるとIETesterのIE6でPNG表示が死ぬ 結果、...
[CSS]IE6にposition:fixedを対応させる方法
CSSの position:fixed を利用することで要素を固定させることができます。 例えば「ヘッダーをページ上部に固定させる」「サイドメニューを固定させる」などなど。 しかしCSSのposition:fixedがIE6には対応していな...
[CSS]CSSで画像を透過させる際はIE6用にfilter:も併用する
リンク画像をロールオーバーさせる時など、要素を半透明にする場合はCSS の opacity プロパティを利用すれば動きます。 CSS3 からは opacity 1つで、モダンブラウザはほぼ動くようになったみたいですが、 IE6で動かない。。...
[IE]IE6〜IE8でも一部のCSS3プロパティが使えるPIE.htcの使い方と動かない時の対処法
IE下位バージョンでもCSS3のborder-radiusやbox-shadow、linear-gradientなどを利用できる便利なPIE.htc。 今回はこのPIE.htcファイルの基本的な設置方法から、動かない時の対処法まで簡単にまと...
[IE]バージョン別に条件分岐させるif構文のまとめ
IE6にのみ特定のjavascriptファイルを有効にさせたり、IE8以下には専用のスタイルを適用させるなど、今でも何かと必要になるIE向けの条件分岐。 今回はそのようなif構文による条件分岐を、IEのバージョン6〜8に絞ってまとめました。...
[Javascript]IE6でも透過PNGが使えるようになるライブラリDD_belatedPNG
WEBサイトを作っていると「透過画像」を使うことが多いのですが、一番の悩みは「IE6では透過画像が正常に表示されない」ので、こいつの対応をどうしてあげるか…です。> <; IEでも7以降や他のブラウザであれば問題なく表示されますので、IE6...
a href=にjavascript:void(0)を指定する際の注意点
void(0)は「何も処理しない」という時に使用します。 aタグのhref属性ではリンククリックを無効化(処理しない)して、onClick属性に書かれたスクリプトを実行する、なんて使い方が多いと思います。 javascript:void(0...
[WP]IE6 No MoreをIE7でのアクセス時にも対応させる方法
IE6でアクセスされた場合、モダンブラウザやIE上位(IE8)の利用を促すアラートメッセージを表示させるWordPressプラグインIE6 No More。 個人的にもIE下位バージョン対応まで手が回らないとか、もう対応はしない(笑)という...