Kann mir jemand bei der Erstellung eines ausklappbaren Seitenmenüs mit Hamburger-Button helfen?

Hoffentlich kann mir hier jemand weiterhelfen.

Ich möchte ein ausfahrbares Seitenmenü mit einem Hamburger-Button (Font Awesome) konstruieren.

Im unteren Bild sieht man meinen momentanen Stand. Ich möchte aber, das von seitlich rechts das Menü hineinschwebt.

Zur Zeit habe ich Folgendes:

<nav role="main-navigation" aria-label="site" id="main-navigate" class="main-navi">
  <button aria-expanded="undefined"></button>
  <ul id="navlinks">
    <li class="sub-menue">
      <a class="a-link" href="/test/public/Testseite2-2.html">Blog Max Mustermann</a>
      <button aria-expanded="undefined"></button>
      <div class="nav-group">
        <a class="a-sublink" href="/test/public/Testseite2-2.html">UNTERMENUE 1-A</a>
        <a class="a-sublink" href="/test/public/Testseite2-2.html">UNTERMENUE 1-B</a>
      </div>
    </li>
    <li class="sub-menue">
      <a class="a-link" href="/test/public/Testseite2-2.html">Blog Erika Mustermann</a>
      <button aria-expanded="undefined"></button>
      <div class="nav-group">
        <a class="a-sublink" href="/test/public/Testseite2-2.html">UNTERMENUE 2-A</a>
        <a class="a-sublink" href="/test/public/Testseite2-2.html">UNTERMENUE 2-B</a>
        <a class="a-sublink" href="/test/public/Testseite2-2.html">UNTERMENUE 2-C</a>
      </div>
    </li>
    <li class="sub-menue">
      <a class="a-link" href="/test/public/Testseite2-2.html">Website Erika Mustermann</a>
      <button aria-expanded="undefined"></button>
      <div class="nav-group">
        <a class="a-sublink" href="/test/public/Testseite2-2.html">UNTERMENUE 3-A</a>
      </div>
    </li>
    <li class="sub-menue">
      <a class="a-link" href="/test/public/Testseite2-2.html">Impressum / Datenschutz</a>
      <button aria-expanded="undefined"></button>
      <div class="nav-group">
        <a class="a-sublink" href="/test/public/Testseite2-2.html">UNTERMENUE 4-A</a>
        <a class="a-sublink" href="/test/public/Testseite2-2.html">UNTERMENUE 4-B</a>
      </div>
    </li>
  </ul>
</nav>

Da mein Post zu lang wird, hier ein Downloadlink des JS, CSS und HTML: LINK wieder gelöscht!

Könnte bitte jemand mir dabei helfen, dies zu entwickeln? Ein rudimentäres CodePen-Beispiel würde mir helfen.

Bild zum Beitrag
Homepage, HTML, Webseite, CSS, JavaScript, HTML5, Code, Webdesign, Webentwicklung
Lua Programmiersprache lernen, empfehlenswerte Bücher?

Hallo Freunde,

ich habe seit 2015/16 angefangen Garry‘s Mod auf verschiedenen Gameservern zu spielen. Dort konnte bereits über 6.000 Spielstunden ansammeln.

2017 habe ich mich dann auch dem Serverteam bei einer etwas größeren Community angeschlossen. Dort fing alles an als Supporter.

Meine Neugier war selbstverständlich sehr hoch, wie solch ein Server überhaupt betrieben wird und wie es zu diesen ganzen Funktionen auf dem Server kommt. Ich eignete mir leichtes Grundwissen an und helfte als ,,Servertechniker“ aus. (Jobs schreiben/umschreiben, Skripte umschreiben/übersetzen und schließlich die Inbetriebnahme eines Gameservers)

2020 eröffnete ich dann meinen eigenen Server mit Skripten aus dem Gmodstore.

Nun möchte ich mich aber selbst an das Programmieren von solchen Skripts befassen, da mir die Arbeiten mit LUA damals schon Spaß gemacht hatten.

Allerdings habe ich keinen blassen Schimmer wie ich mit einem Skript überhaupt anfange, die Funktionen, das Overlay und alles was eben dazugehört.

Schlichtweg möchte ich erstmal einfacheren Skripte schreiben. (z.B Scoreboard und HUD)

Gibt es für die Programmiersprache LUA gute Bücher oder Webseiten die ihr mir empfehlen könntet?

Textprogramm mit dem ich damals gearbeitet habe war Notepad++, nun möchte ich aber mit Visual Code Studio arbeiten.

Ich hoffe ihr könnt mir weiterhelfen.

Computer, Computerspiele, Mods, Programm, Community, Webseite, Programmierer, programmieren, Garry's Mod, lua, Programmiersprache, Visual Studio, Visual Studio Code, Garry's Mod Server

Meistgelesene Beiträge zum Thema Webseite