Menü, welches beim klicken "ausfährt" in Javascript, CSS oder irgendwie anders programmieren?

...komplette Frage anzeigen

2 Antworten

Deiner Beschreibung nach, ist dieses Menü recht umständlich umgesetzt worden. Wieso kann man erst darauf klicken, wenn der Titel ausgefahren ist, sollte das Icon nicht ausreichen? Wieso wird überhaupt ein Icon verwendet, wenn es offensichtlich nochmals erklärt werden muss?

Nun gut, zu der Umsetzung. Wie Dropdown- oder Sidebar-Menüs erstellt werden, wird hier erklärt:

Ich denke, danach solltest du auch eine Navigation nach deinen Vorstellungen umsetzen können.

Allerdings solltest du dich auch erst mit den Grundlagen von HTML und CSS beschäftigen, die du offensichtlich noch nicht hast. Mache dir im Vorfeld auch Gedanken über die Usability von Navigationsmenüs. Nutzen kommt vor Aussehen. 

Einen Hover-Effekt, das "Wischen", wie du meintest, kannst du sehr leicht mit css machen.

html

.menu
  .icon
  .search

css

.menu .search
    display: none

.menu:hover .icon
    display: none

.menu:hover .search
    display: block

Wenn du statt eines Hovers einen Klick haben möchtest, nutze JavaScript und wechsel' dann die Klassen, z.B. so

html

.menu#menu
  .icon
  .search

css

.visible
    display: block

.hidden
    display: none

var menu = document.getElementById('menu');
var
var icon = document.getElementById('icon');

menu.addEventListener('click', function () {
  icon.addClass('hidden');
  // selbes für Suchleiste
});

Was möchtest Du wissen?