Button Menü automatisch schliessen

[mely]

Hallo,

ich wollte fragen, wie man einen ButtonMenü, also Menü für Händys nach dem Auswahl der gewünschte Link automatisch zugeht. Also ich habe einen:

$("#mobile-icon").click(function(){
        $("nav").toggle();
    });

und

  #mobile-icon span { position: absolute; right: 0; top: 1.5em; margin-right: 1em; }

	#mobile-icon span, 
	#mobile-icon span:before,
	#mobile-icon span:after {
	   cursor: pointer;
	   border-radius: 1px;
	   background: #000;
	   position: absolute;
	   display: block;
	   content: '';
	}

Vielen Dank im voraus!

Grüße,

[Sara]

Hey,

schau dir mal diese Navigation, da ich deine Webseite ja kennen, sollte sich dieses Script leicht in dein Projekt einbauen lassen: http://slicknav.com/

Hier gibt es noch sehr viel mehr fertige Navigationen, die sich recht einfach in eine bestehende Seite einbauen lassen: http://www.drweb.de/magazin/responsive-navigation-design-trends-2015-53019/

[Sara]

Hallo,

dein ganzer JS Code sieht ja wie folgt aus

$("#mobile-icon").click(function(){
        $("nav").toggle();
    });

$('nav a[href^="#"]').on('click', function (e) {
         e.preventDefault();
         $(document).off("scroll");
 
         $('a').each(function () {
           $(this).removeClass('active');
         })
         $(this).addClass('active');
 
         var target = this.hash;
         $target = $(target);
         $('html, body').stop().animate({
              'scrollTop': $target.offset().top+2
         }, 500, 'swing', function () {
         window.location.hash = target;
         $(document).on("scroll", onScroll);
          });
    });
});

Und dein HTML lautet

 <a id="mobile-icon" href="#"><div class="mobile-icon-fest"><span></span></div></a>
  <nav>
    <ul id="menu">
      <li><a href="#1" class="active"></a></li>
      <li><a href="#2"></a></li>
      <li><a href="#3"></a></li>
      <li><a href="#4"></a></li>
      <li><a href="#5"></a></li>
      <li><a href="#6">V</a></li>
      <li><a href="#7"></a></li>
    </ul>
  </nav>

Vielleicht wäre es auch möglich, dass man dem JS Code einfach eine Zeile hinzufügt welche dafür sorgt, dass <nav> wieder ausgeblendet wird, sobald man auf einen <li> Punkt innerhalb von <nav> geklickt hat.

Problem ist, ich kenne mich mit JavaScript nicht wirklich gut aus :) Vielleicht kann sich ja jemand melden, der von JS etwas mehr Ahnung hat :)

[mely]

Hallo danke Sara für die Links, aber ich habe es immernoch nicht geschafft es zu machen. Kann jmd helfen?

Grüße, mely

[Sara]

Hallo,

aber ich habe es immernoch nicht geschafft es zu machen. Kann jmd helfen?

da kann ich dir leider auch nicht viel helfen, denn mit JavaScript kenne ich mich einfach zu wenig auf. Ich drück dir auf alle Fälle die Daumen, dass sich noch jemand meldet. Ansonsten müsstest du wirklich etwas fertiges nehmen und dieses versuchen in deine Seite einzubauen.

[mely]

hey, ja kein Problem und danke dir :) Ich versuche es. :)

[Sara]

Hallo,

vielleicht kannst du hier: http://ironsummitmedia.github.io/startbootstrap-creative/ dir etwas abschauen wie es umgesetzt wird.

Alternativ gibt es aber auch Seiten, wo die Navigation einfach offen bleibt, siehe hier: http://ironsummitmedia.github.io/startbootstrap-landing-page/#contact

Ich denke es ist einfach Geschmackssache wie man vorgeht. Mir persönlich wäre es egal ob die Navigation zugeht oder offen bleibt. In dieser Zeit würde ich mich um andere wichtige Sachen kümmern, wenn ich wahrscheinlich auch mit dieser Meinung allein dastehe :)

[mely]

Hallo,

vielleicht kannst du hier: http://ironsummitmedia.github.io/startbootstrap-creative/ dir etwas abschauen wie es umgesetzt wird.

ja, ich habe es mir angeguckt, aber sieht zu kompliziert und nicht machbar(in meinem Kopf).

Alternativ gibt es aber auch Seiten, wo die Navigation einfach offen bleibt, siehe hier: http://ironsummitmedia.github.io/startbootstrap-landing-page/#contact

Die Seite kann auch so bleiben. Es ist nicht ein Problem. Aber irgendwie, wenn ich etwas nicht schaffe, mache mir gedanken und sage mir dass es nicht so schwer sein soll und dass ich es schaffen kann. Ich probiere noch bisschen.

Ich denke es ist einfach Geschmackssache wie man vorgeht. Mir persönlich wäre es egal ob die Navigation zugeht oder offen bleibt. In dieser Zeit würde ich mich um andere wichtige Sachen kümmern, wenn ich wahrscheinlich auch mit dieser Meinung allein dastehe :)

ja das stimmt auch. Es ist Geschmacktsache, aber wie gesagt: es stört mich nicht, dass die Seite es nicht hat, sondern dass ich es nicht geschafft habe.:)

[Sara]

Hallo,

ja, ich habe es mir angeguckt, aber sieht zu kompliziert und nicht machbar(in meinem Kopf).

ich schau es mir morgen früh auch mal etwas genauer an. Bin ab 06:00 Uhr im Büro und habe bisschen Zeit.

Die Seite kann auch so bleiben. Es ist nicht ein Problem. Aber irgendwie, wenn ich etwas nicht schaffe, mache mir gedanken und sage mir dass es nicht so schwer sein soll und dass ich es schaffen kann. Ich probiere noch bisschen.

So geht es mir leider auch :) Irgendwie muss man aber auch mal sagen, die Zeit die man investiert kann man für etwas anderes nutzen was vielleicht mehr Mehrwert für den Nutzer hat.

[mely]

Vielen Dank, Sara, dass du dir es anguckst. Ich suche aber immernoch, was geeignetes, was ich umsetzten kann.

Grüße