7

:after次のように、メディアクエリブレークポイントの名前を表示するボディに疑似要素を適用しています。

body::after {
  content: 'medium';
  display: none;
}

これを行う理由はここにあります: http://adactio.com/journal/5429/

:afterIE8 で JavaScriptを使用してコンテンツの値を取得したいと考えています。

これは私が他のブラウザでやっている方法です：

var breakpoint = window.getComputedStyle(document.body, ':after').getPropertyValue('content');

しかし、IE8はサポートしていません。代わりgetComputedStyle()にサポートしていることはわかっていますcurrentStyleが、少し試してみると、正しく使用できませんでした。

これは私が成功しなかった種類のものです:

var breakpoint = document.body.currentStyle.getPropertyValue('content');

誰でもこれを行う方法を知っていますか?

編集: BoltClock のメモの後、CSS を次のように変更しました (1 つのセミコロン):

body:after {
  content: 'medium';
  display: none;
}

2 つを使用する前は、コンテンツは IE8 にさえ表示されていなかったので、返すものは何もありませんでした。残念ながら、IE8 でコンテンツを返すことはまだできません。

私はこれを試しています：

if (style = document.body.currentStyle) {
  for (var prop in style) {
    if (prop === 'content') {
      alert(prop);
    }
  }
}

何も得られませんが、'content'他のプロパティに変更すると、'backgroundColor'何かが警告されます。したがって、msdn がコンテンツをcurrentStyle http://msdn.microsoft.com/en-us/library/ie/ms535231%28v=vs.85%29.aspxの利用可能なプロパティの 1 つとしてリストしていても、そうではないと考えています。私が何か間違ったことをしていない限り、実際にそれを返します。

4

2 に答える 2

1

いろいろ試した結果、無理だという結論に達しました。しかし、ありがたいことに、私が求めていたものを正確に達成しているjsスクリプトを見つけました.

https://github.com/JoshBarr/js-media-queries

ブレークポイント ラベルを本文に配置する Jeremy Keith の手法を使用するだけでなく、html 要素の font-family にブレークポイント ラベルを配置した後。これにより、ie8 と、android が :after コンテンツを返すことができなかったいくつかのケースのサポートが有効になります。

于 2012-10-30T11:58:42.143 に答える
0

IE7 から IE11 まで、「独自の CSS プロパティを作成」し、currentStyleオブジェクトを使用してアクセスするだけです。

その場合の解決策は、「偽のコンテンツ プロパティ」を作成することです。

body:after
{
    content: 'medium';
    -ms-content: 'medium';
}

便宜上「-ms-content」と呼びましたが、IE の JavaScript コードは次のようになります。

document.body.currentStyle["-ms-content"] // RETURNS => 'medium'

括弧を使用して「独自のプロパティ」にアクセスする必要があります: currentStyle[{String}] そうしないと、空の文字列が返されます。

于 2016-06-04T12:43:09.800 に答える