JavaScript vs. CSS-Menü

Seit Beginn des Internets, haben Webseiten Menüs zur Navigation verwendet. Alles andere als die einfache horizontale und vertikale Linklisten von Yore beschäftigen heute Websites komplizierte Navigationsstrukturen Verknüpfung Hervorhebung, Drop-Down-Menüs, Fliege-Belegung und vieles mehr. Mehr komplexe und interaktive Menüs erstellen, erfordert eine Kombination von Code Cascading Stylesheet (CSS) und JavaScript. Statt denken von JavaScript vs. CSS, verwenden Sie JavaScript, Ihre CSS-Code ergänzen und vor allem um bieten Spezialeffekte oder Browser-Kompatibilität maximieren.

CSS für Menüs

Entwickler können beeindruckende Menüs erstellen, indem Sie mit CSS ungeordnete Listen bearbeiten. Diese Technik ermöglicht eine sehr viel Abwechslung in den Menüs, sowie Effekte wie abgerundete Ecken, Verläufe, Schlagschatten und mehr. Die meisten dieser Effekte sind dank CSS Level 3 (CSS3). Einige Probleme gibt, wenn Sie versuchen, diese machen Menüs arbeiten mit älteren Browsern, die keine Unterstützung von CSS3 oder Fehler, die behindern, CSS Programmierung im Allgemeinen enthalten. Insbesondere, wenn ein Menü in CSS für Internet Explorer 6 Stile, können die Pseudoklasse "Hover" Sie einen Hover-Status für etwas anderes als eigentlichen Verknüpfungen auslösen. Diese Browser-Einschränkung schafft Probleme, wenn die Menüs ein Hover-Status für eine gesamte Listenelement benötigen.

Rückwärts-Kompatibilität für CSS

Um das Problem anzugehen, Rückwärts Kompatibilität beim Browser CSS3-Eigenschaften nicht unterstützen Sie können eine der beiden Optionen prüfen. Die erste heißt alternativ "graceful Degradation" und "progressive Enhancement." Diese beiden Begriffe bedeuten, dass, anstatt Erstellung von Webseiten in allen Browsern gleich aussehen, Sie sollten nur konzentrieren sich auf die Webseite in allen Browsern benutzbar zu halten. In vielen Situationen müssen Sie immer noch Websites erstellen, die in allen Browsern gleich aussehen. In diesem Fall wickeln Sie bedingte Kommentare, um Internet Explorer-spezifischen CSS-Dateien und erstellen Sie nicht-CSS3 für Ihre Menüs zu. Sie müssen auch entsprechende Grafiken zur Neuerstellung des CSS3-Effekte zu erstellen.

JavaScript für Menüs

Sobald Sie ein Menü im HTML-code und CSS gestalten, können Sie es weiter mit JavaScript bearbeiten. Beispielsweise viele "Plugin"-Skripts in jQuery--ein JavaScript-Framework häufig verwendet, um Elemente auf Webseiten animieren--existieren, die beide glatten Effekte hinzufügen und Rückwärts Kompatibilität mit Drop-down-Pfeil oder "Suckerfish" Stil Menüs. Die Tatsache, die Benutzer JavaScript in ihrem Browser abschalten können kann eine Herausforderung dar, da die meisten Entwickler Website-Navigation nutzbar für jeden Benutzer beibehalten möchten.

Hybrid CSS & JavaScript-Menüs

Wenn Sie Menüs für Webseiten erstellen, sollten Sie stets die Liste der Links mit einer ungeordneten Liste in HTML, das Menü Stil, soviel Sie in CSS können und JavaScript dann verwenden, nur wenn Sie es für eine Animation oder rückwärts Kompatibilität mit Internet Explorer 6 unbedingt erstellen. Sie brauchen nicht JavaScript Dropdown-Menüs erstellen. So genannte "pure CSS" Dropdown-Lösungen gibt, dass die Arbeit in den meisten Browsern.