Milligram: Navigationsleiste als Teil von Milligramm?

Die Idee ist großartig, aber meine Absicht ist es, das Milligramm so leicht wie möglich zu halten und das für die Initialisierung eines Projekts erforderliche Minimum an Funktionen zu unterstützen. Übrigens, was Sie vorschlagen, wäre eine sehr spezifische Komponente. Ich schließe Ihre Anfrage und schätze ihre Bemühungen, dieses Projekt zu verbessern.

https://github.com/milligram/milligram/pull/46

Hallo @alexjj @abouthiroppy

Tatsächlich ist es meine Absicht, Milligram so leicht wie möglich zu halten und das für die Initialisierung eines Projekts erforderliche Minimum an Funktionen zu unterstützen.

Du hast mir geholfen, eine tolle Idee zu haben! Ich werde ein Repository mit Komponenten erstellen, die mit Milligram erstellt wurden. Dies soll vielen Menschen helfen, einen Ort zu finden, an dem sie leichter etwas finden, was ihnen im Alltag hilft.

http://codepen.io/milligram/

Scheint nicht bekannt oder verwendet zu sein, aber ich hätte auch gerne eine Reihe von Navbars

Auch hier sind Navbar und Menüs die Mindestfunktionalität, die für ein Projekt erforderlich ist, nicht wahr?

Heya, ich suche nach einem Framework, das Bootstrap für mich ersetzen kann und Milligramm ist ein ernsthafter Anwärter.

Ich könnte wirklich noch ein paar weitere Beispiele gebrauchen, da ich mit dem Framework noch nicht vertraut bin, aber der von Ihnen gestellte Codepen-Link funktioniert nicht. Hast du noch einen Link?

Vielen Dank!

Du gibst mir tolle Ideen. 😍

Irgendein Ergebnis zu den Navbar-Ideen?

Milligramm ist ziemlich gut, aber ich würde definitiv gerne mehr Nav-Optionen sehen, insbesondere für die Verwendung mit Sage 9 (Wordpress) Builds, die normalerweise einen Nav-Walker benötigen, es sei denn, jemand kann mich diesbezüglich korrigieren?, Danke

Der Link von https://codepen.io/milligramcss/

(Außerdem wäre ich definitiv dafür, Milligram eine Navigationsleiste hinzuzufügen. Ich stimme nicht mit anderen überein, die sagen, dass es eine begrenzte Sache ist, die die Leute wollen, 90% der Websites haben eine Navigationsleiste.)

Navi wäre toll

Ich möchte hinzufügen, dass die Tatsache, dass die github.io-Site über eine Navigationsleiste verfügt, mich zu der Annahme veranlasst hat, dass das Paket selbst eine Navigationsleiste hatte. es ist ziemlich unaufrichtig.

Ich bin nicht einverstanden. Das Seitendokument gibt nicht an, dass eine Navigationsleiste irgendwo eine Kernkomponente ist. Die Tatsache, dass die Seite über eine Navigationsleiste verfügt, bedeutet nicht, dass sie Teil des Frameworks ist. Es ist nicht unaufrichtig, Sie haben einfach eine falsche Annahme getroffen.

Ja, ich dachte, das Paket hätte eine Navigationsleiste, bis ich anfing zu lesen und herausfand, dass dies nicht der Fall war. Es hat mich ehrlich gesagt überrascht - meine Erwartung beim Betrachten von UI-Paketen ist, dass sie im Allgemeinen nur die Tools verwenden, die sie bereitstellen. Ich habe das CSS der Site durchgesehen - einfach das nav Tag zu stylen und etwas Styling für Nav-Links hinzuzufügen, scheint nicht zu viel Overhead zu verursachen?

^^ Alles, was gesagt wurde ... hat jemand eine ziemlich einfache Navigationsleiste mit Logo und Menüelementen implementiert, die als Beispiel auf dem Handy in ein Hamburger-Menü aufgegliedert wird?
BEARBEITEN: Hier wird hinzugefügt, dass JS nicht bevorzugt wird ... BESONDERS Jquery. Nö. CSS nur stark bevorzugt. zulässiger Cheat wäre eine kleine Menge Vanille-JS, aber überhaupt kein JS.

^^ Alles, was gesagt wurde ... hat jemand eine ziemlich einfache Navigationsleiste mit Logo und Menüelementen implementiert, die als Beispiel auf dem Handy in ein Hamburger-Menü aufgegliedert wird?

Ich versuche das jetzt mit dem in Milligramm enthaltenen Beispiel und verwende https://github.com/shuedna/Milligram-baseSite-withMenu als Referenz. Ich bin auch sehr unerfahren damit, daher kann es nicht gelingen.

Aber ich stimme dem oben zu; Ein reaktionsschnelles Navi ist ziemlich grundlegend.

vorherige Anfrage aktualisiert... Nur CSS, kein JS, insbesondere kein jQuery.

Nur CSS Milligramm NavBar

Quelle
Beispiel
MIT-Lizenz

Hängt von der Basisbibliothek ab.

Gute Arbeit @popey456963. Das einzige ist, dass es sich nicht auf ein Menü im Hamburger-Stil reduziert.
Ich habe die Anforderung von kein JS/jquery oder Vanilla JS vermisst. So oder so hatte ich nicht viel Erfolg auf meiner Seite.. noch.

Ich habe meine Suche nach einem reinen CSS-Navigationsgerät gestoppt, das aus Zeitgründen vorerst zu einem Hamburger-Menü zusammenfällt; Ich habe den Text einfach durch großartige Icons ersetzt, die kompakter sind und beim Verkleinern schön angezeigt werden. Auch für das Element 'navigation-item' habe ich margin-left auf 1.5rem verringert.

Sobald ich dieses Projekt abgeschlossen habe, werde ich es erneut versuchen ... falls es noch nicht jemand anderes abgeschlossen hat.

Verstecken Sie auch die Navigationsleiste beim Hochscrollen:
Für Navigationsklasse hinzufügen: Übergang: top 0.3s;
id = "Navigationsleiste" hinzufügen
JS unten:

var prevScrollpos = window.pageYOffset;
window.onscroll = function() {
  var currentScrollPos = window.pageYOffset;
  if (prevScrollpos > currentScrollPos) {
    document.getElementById("navbar").style.top = "0";
  } else {
    document.getElementById("navbar").style.top = "-50px";
  }
  prevScrollpos = currentScrollPos;
}

Keine Jquery oder andere Deps erforderlich

Ich denke, normalerweise möchten Sie die Navigationsleiste beim Herunterscrollen ausblenden, nicht beim Hochscrollen?

Der Code ist zum nach unten scrollen. Entschuldigung, ich habe mich vertippt

Nachverfolgung von nur CSS-Responsive-Nav ... dieses ist einfach und funktioniert großartig:
https://codepen.io/chuckreynolds/pen/ROaeXv

Nachverfolgung von nur CSS-Responsive-Nav ... dieses ist einfach und funktioniert großartig:
codepen.io/chuckreynolds/pen/ROaeXv

Danke für den Link. Aber wie bringe ich das zusammen? Der Inhalt meines Containers scrollt 'hinter' der Kopfzeile. Es sollte eine Art Polsterung geben.

Nur ein Kommentar.

Wenn es vorgefertigte Navbar-Dinge gibt, wird das Erstellen der Benutzeroberfläche erheblich schneller.
Aber denken Sie nicht, dass die Navigationsleiste etwas nutzloses ist? Ich bevorzuge es, eine Navbar im Semantic-UI-Stil bereitzustellen (mithilfe des Menüs zur Bereitstellung der Navbar).

Ich denke nicht, dass too much gut ist. :)

Leute, danke, dass ihr @ geholfen habt. Vorerst schließe ich dieses Thema.
Wenn jemand Hilfe braucht, kann er gerne wieder öffnen oder ein neues eröffnen!