navigation Archives - csshint - A designer hub

10 CSS Sliding Menus example

admin — Tue, 16 Apr 2019 19:53:01 +0000

Collection of free HTML and CSS sliding menus code examples.

1.Easy Sliding Menu w/ Animated Button

Easy Sliding Menu

Author

Yago Estévez

Made with

HTML (Pug) / CSS (SCSS) / JS

demo and code Get Hosting

2.Sidebar Interaction

Sidebar Interaction

Author

Siddharth Parmar

Made with

html/ css/ scss/js/babel

demo and code Get Hosting

3.Off-screen nav with :focus-within [PURE CSS]

Off-screen nav

Author

Dannie Vinther

Made with

html/ css/js

demo and code Get Hosting

4.UI with UX improvements with only CSS

See the Pen UI with UX improvements with only CSS by Twikito
(@Twikito) on CodePen.

Author

Twikito

Made with

html/css/scss/js

demo and code Get Hosting

5.Awesome Bootstrap 3 Sidebar Navigation

See the Pen Awesome Bootstrap 3 Sidebar Navigation by Jay Holtslander
(@j_holtslander) on CodePen.

Author

Jay Holtslander

Made with

html/css/less/js

demo and code Get Hosting

6.Slide out / hamburger / club sandwich menu

See the Pen Slide out / hamburger / club sandwich menu by Jonno Witts
(@jonnowitts) on CodePen.

Author

Jonno Witts

Made with

html/css/scss/js

demo and code Get Hosting

7.transparency

See the Pen transparency by Brady Hullopeter
(@bradyhullopeter) on CodePen.

Author

Brady Hullopeter

Made with

html/css/scss/js/babel

demo and code Get Hosting

8.Multi level css only push menu

See the Pen Multi level css only push menu by Shven
(@Shven) on CodePen.

Author

Shven

Made with

HTML / CSS (Sass)

demo and code Get Hosting

9.3D Off-canvas navigation

See the Pen 3D Off-canvas navigation by iamarend
(@iamarend) on CodePen.

Author

iamarend

Made with

HTML (Haml) / CSS (SCSS) / JS (Babel)

demo and code Get Hosting

10.Left slide menu with icon

See the Pen Left slide menu with icon by Roman
(@ramzs) on CodePen.

Author

Roman

Made with

HTML / CSS / JS

demo and code Get Hosting

The post 10 CSS Sliding Menus example appeared first on csshint - A designer hub.

14 Awesome example’s of Full screen Navigation Menus

admin — Sun, 29 Apr 2018 08:25:11 +0000

Collection of free full screen navigation Menus – Are you Looking for creative ways to design your navigation menus? Then you Have Come to the Right Place because In this article I’ll like to share some inspiration on fullscreen overlay styles and effects with you.
Use this Full screen Navigation menu in your next project where you want to show a full-screen navigation menu.

Awesome! We’re done! We hope you enjoy these effects and find them inspiring!. let me know what you think in the comments.

The post 14 Awesome example’s of Full screen Navigation Menus appeared first on csshint - A designer hub.

17+ Circular menu example’s

admin — Sun, 29 Apr 2018 07:58:08 +0000

Circular menu break the generic UI pattern of horizontal navigations. In this showcasing, we have pick up beautiful 17+ best circular menu made with Sass and CSS3 transitions, transforms, and animations. All menu are Circular shaped with an appealing and modern look that opens when menu button is clicked. Works in modern browsers, both desktop and mobile. and you can download free and customize easily like: colors, sizes, icons, position, links, and much more…
so Grab and build a beautiful circular navigation menu for your website and impress your visitors.

See the Pen Circular Menu by Rahul Rai
(@rahul-rai-the-styleful) on CodePen.