background-size polyfillの使い方、IE8で背景画像を全画面表示にする時の注意点 | お墨付き！
body { /* 画像ファイルの指定 */ background-image: url(images/background-photo.jpg); /* 画像を常に天地左右の中央に配置 */ background-position: center center; /* 画像をタイル状に繰り返し表示しない */ background-repeat: no-repeat; /* コンテンツの高さが画像の高さより大きい時、動かないように固定 */ background-attachment: fixed; /* 表示するコンテナの大きさに基づいて、背景画像を調整 */ background-size: cover; /* 背景画像が読み込まれる前に表示される背景のカラー */ b
【jquery】IEのhover（mouseenter/mouseleave）がおかしい？ at softelメモ
問題 mouseenter、mouseleaveイベントを使った処理をjQueryで書いたのだが、IEとそれ以外で何か動きが違う。 IEは想定外の箇所でmouseleaveが発生した。なぜ？ たぶん答え Microsoftさんの世界ではよくあるみたいなのですが、背景色が指定されていないコントロールは、その透明部分にマウスが出た時点で、コントロールからマウスが外れたというイベントが発生するようです。 IEも同じなのかもしれません。 ブラウザで発生した問題の現象は、背景色をtransparentではなく、何かしらの色を設定することで、発生しなくなりました。 jQueryの内部でも、mouseenter、mouseleaveの処理はIEか非IEかで切り替えているようです。 問題の例 こういうメニューを作るとする。 一番外側の全体を囲んでいる外枠のボックス（赤点線）の中に背景色がないとき、外枠にm
IE8で nth-child を使う│WEB│グラビカ学習帳～ホームページ制作会社 gravity works（グラビティ・ワークス）の備忘録と知識の共有と蓄積
first-childは、IE8でもきくのですが、 nth-child(n)はきかないのですよねー。 これが使えたらすごく便利なのに。 ということで調べてみました。 いろいろ適応させる方法はあるようなのですが、使いたい部分がサイトの共通部分で その案件が、大きめの案件で既に納品しているページもあったので ヘッターの記述に新たに何か追加したくなかったことと、 はずかしながら、自分はjsの理解度が低いので、CSS内で解決という条件で探しました。 下記ページのハックが簡単でわかりやすかったです。 CSS: Internet Explorer 7-8 nth-child hack これを ------------ .test ul li:nth-child(3){ background: yellow; } ------------ こう書く ------------ .test ul > *:f
【クリスマスだし】Internet Explorerとうまく付き合う方法【IE対応まとめ】【25日目の6】 | DevelopersIO
IE6はﾀﾋぬDeath! こんばんは、クラスメソッドWebマスターの野中です。 今日はクリスマスですね、社内には独り身の負のオーラが満ちてます（既婚者が多いので残っている人は少ない）。 ところで、最近はCSS3もすこしずつ使えるようになってきていて、IE6からIE8の対応を蔑ろにしてしまっている自分がいます。 Web制作に携わってから6年、常に付きまとう古いIEは腐れ縁というか、ある意味青春ですね。 とっても今さら感たっぷりなお題目ですが、ここでIE対応のポイントを自分のために総浚いして青春に決着をつけたいと思います。 過去の経験と情報収集をもとにまとめているので実際にテストしたものではありません。 解決のきっかけ程度になれば良いと思いまとめています。 IEの現状 一般的なブラウザと先進的なブラウザに対する手法と考え方 ドキュメントタイプ：文書型定義 IE向け条件付きコメントで分岐処理
IEで固定座標を指定する方法
さて、アナウンスしていたようにIEでposition: fixed;を実現する手法について簡単にまとめておきます。まぁこのテクニックもIE7が出るまでのつなぎです。やり方は大まかには2通りあって、純粋にCSS(スタイルシート)のみで指定する方法とJavaScript(正確にはMS独自のDynamic property ダイナミックプロパティーと呼ばれるもの)を使うやり方です。 まず、1.CSSのみの方法から １．基本的な考え方は、HTML(あるいはBODY)タグのスクロールバーを非表示にして、かわりにDIVタグ(HTMLならBODYタグ)のスクロールバーを表示させる方法です。具体的な記述は以下のようになります。 html { overflow: hidden; } body { height: 100%; overflow: auto; } 次に、固定表示したいDIVタグ(タグは何でも良い
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IE8: Div hover only works when background color is set, very strange, why?
Internet Explorer