Stack-Überlauf-like JavaScript Warnung und w3c HTML-Validierung

StackOverflow https://stackoverflow.com/questions/4154479

  •  08-10-2019
  •  | 
  •  

Frage

Ich habe eine Website, die stark auf JavaScript angewiesen ist. Während die meisten Sachen schön stuft ist die funktionell wirklich der zweiten Klasse. Also, ich wünsche den Benutzer zu warnen, dass sie sollten JS einschalten, wenn sie es nicht deaktiviert haben. Dazu verwende ich NOSCRIPT ein div mit Alarm zeigen einen Seitenanfang, ähnlich wie Stack-Überlauf tut es.

Diese div Abdeckung des Seiteninhaltes oben, so dass ich das Dokument Körper nach unten bewegen muß. Da JS nicht verfügbar ist, hat ein CSS zu verwenden, und ich verwende etwas wie: margin-top: 8px. Die komplette HTML sieht wie folgt aus: 

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

Das Problem ist: wo finde ich diesen Code platzieren

habe ich versucht, in dem HEAD-Abschnitt, in dem Körperabschnitt, nachdem der Körper, sondern überall dort, wo es platziert wird, W3C HTML-Markup Validator beklagt, dass entweder Dokumenttyp nicht Element „STYLE“ erlaubt hier oder Dokumenttyp nicht erlaubt Element "BODY" hier

Ich habe sogar versucht zu trennen CSS und DIV in zwei Teile und eine richtige Platzierung für jeden von ihnen zu finden, bekam aber die gleichen Fehler.

War es hilfreich?

Lösung

Sie können nur saugen haben und Ihre Seite nicht akzeptieren Validieren.

... oder ändern, wie es funktioniert. Können Sie es zuerst mit position: static platzieren, damit es Ihren Seiteninhalt nach unten natürlich drückt?

... oder , sein heikel machen Ihre body immer margin-top: 8em haben. Dann auf DOM bereit (oder Fenster Last) in JavaScript, macht es 0.

CSS 

body {
   margin-top: 8em;
}

body.javascript {
   margin-top: 0;
}

JavaScript 

window.onload = function() {
   document.getElementsByTagName('body')[0].className += ' javascript';
};

Andere Tipps

Sie benötigen ein Blockelement haben (z div) im Inneren des noscript Element und das Stilelement im Inneren des Kopfelement bewegen richtige Validierung zu gewinnen.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top