Circles Navigation für Bootstrap 3.x – kostenloser Download

Individualisiere deine Bootstrap Website mit Navigation Circles von Augenschnapper

Immer mal wieder entstehen aus der Entwicklung heraus Bootstrap Snippets, mit denen ich dann im aktuellen Projekt nichts mehr anfangen kann. Die Navigation Circles sind ein Beispiel dafür. Die aus Kreisen von mir erstellte horizontale Navigation möchte ich euch allerdings nicht vorenthalten und stelle sie hier online zum Download bereit.

Effekte ohne jQuery: CSS3 Navbar

Die aus Kreisbuttons bestehende horizontale Navi ist mit Hover-Effekten versehen. Diese sind von mir mit CSS3 umgesetzt worden und können so einfach editiert, ersetzt oder abgeschaltet werden. Um euch selbst ein Bild von der Navigation zu machen, klickt auf die Vorschau. Diese könnt ihr auch gleich komplett im Package herunterladen und auf eurer Seite einbauen.

navigation-circles-for-bootstrap

Vorschau und Download

Klicke hier für eine Vorschau: Navigation Circles for Bootstrap 3.x
Download: Navigation Circles for Bootstrap 3.x – ZIP Package

Voraussetzungen:

  • Bootstrap 3.x (bekommt ihr hier)
  • Font-Awesome (bekommt ihr hier)

Im Download ist Bootstrap (möglichweise nicht mehr die aktuellste Version) inklusive Font-Awesome dabei.

 

CSS Info:

Unter Body befinden sich Standard-Einstellungen, die in deinem Projekt nicht unbedingt ersetzt werden müssen. Hier übernimmt die Nav-Circle dann wie gewohnt die Schriftarten und Größen deines Projekts.
Effects sorgt dafür, dass du beim Hovern einen entsprechenden Effekt mittels Animation erhälst. Wünschst du keine Effekte, empfiehlt es sich die Klasse „.grow“ im HTML Navi zu entfernen.

Download Circle Navigation

Download: Navigation Circles for Bootstrap 3.x – ZIP Package

laith

laith

Laith ist Autor bei Augenschnapper, Inhaber der Webagentur qlixx.net und hauptberuflicher Mediendesigner.

Siehe auch...

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.