CSS mit und ohne Javascript

Erstellt am: 05.02.2011 um 21:28 Uhr

Ein alt bekanntes Thema: Man setzt eine Website um und verwendet dabei Javascript. Jedoch muss man darauf achten, dass es auch Benutzer im Web gibt, die kein Javascript aktiviert haben. Ich hatte neulich dieses Problem. Ich habe ein vertikales Dropdown-Menü erstellt. Mit Javascript kein Thema. Doch hat der Benutzer Javascript deaktiviert, sieht er die benötigten Menüpunkte nicht. Er muss dann auf die jeweilige Seite klicken und sieht dort dann erst in der Sidebar die Unterpunkte.

Ich habe das Problem also so gelöst. Ich gebe dem <body>-Tag die Klasse “no-js”. Wenn nun die Seite geladen wird, wird überprüft ob Javascript aktiviert ist. Sollte dies der Fall sein, wird der Klassenname durch "js" ersetzt. Nun kann ich mithilfe von CSS die gewünschten Elemente umstylen und ggf. auch ausblenden.

Anmerkung: Ich habe für die Umsetzung jQuery benutzt!

Hier einmal der Code, wie in etwa ich mir das vorstelle:

<script type="text/javascript">
	$(document).ready(function(){
		$('body').removeClass('no-js');
		$('body').addClass('js');
	});
</script>