0

JavaScriptに大きく依存しているWebサイトがあります。ほとんどのものはうまくダウングレードされますが、機能的には本当に2年生です。そこで、JSを無効にしている場合は、JSをオンにする必要があることをユーザーに警告したいと思います。これを行うには、スタックオーバーフローの場合と同様に、NOSCRIPTを使用してページの上部にアラート付きのdivを表示します。

このdivはページのコンテンツの上部をカバーしているため、ドキュメントの本文を下に移動する必要があります。JSは利用できないので、CSSを使用する必要があり、私は次のようなものを使用しますmargin-top: 8px。完全なHTMLは次のようになります。

<noscript>
<style type="text/css">body { margin-top:8em; }</style>
<div class="warn">WARNING<br>Turn on JavaScript for best experience</div>
</noscript>

問題は、このコードをどこに配置するかです。

HEADセクション、BODYセクション、BODYの後に試しましたが、どこに配置しても、W3C HTMLマークアップバリデーターは、ドキュメントタイプがここで要素「STYLE」を許可しないか、ドキュメントタイプが要素「BODY」を許可しないと文句を言います。

CSSとDIVを2つの部分に分けて、それぞれの適切な配置を見つけようとしましたが、同じエラーが発生しました。

4

2 に答える 2

2

あなたはそれを吸い上げて、あなたのページが検証されないことを受け入れる必要があるかもしれません.

...または動作を変更します。position: staticページのコンテンツを自然に押し下げるように最初に配置できますか?

...または、トリッキーにするために、body常に持っているようにしますmargin-top: 8em。次に、JavaScript で DOM 準備完了 (またはウィンドウの読み込み) で、0 にします。

CSS

body {
   margin-top: 8em;
}

body.javascript {
   margin-top: 0;
}

JavaScript

window.onload = function() {
   document.getElementsByTagName('body')[0].className += ' javascript';
};
于 2010-11-11T12:45:25.493 に答える
-1

適切な検証を行うには、noscript 要素内にブロック要素 (div など) を配置し、head 要素内に style 要素を移動する必要があります。

于 2010-11-11T15:19:50.993 に答える