21:24
![[TUT+] Navigation Menu - side menu](http://codropspz.tympanus.netdna-cdn.com/codrops/wp-content/uploads/2013/04/YouTubeLeftSideMenu.jpg "[TUT+] Navigation Menu - side menu")
Trong bài viết hôm nay mình xin giới thiệu vợ các bạn một loại menu khá độc đáo, với loại menu này các bạn hoàn toàn có thể tiết kiệm tối đa diện tích trang web và dành diện tích đó cho một chức năng khác mà không làm mất đi tính đa năng vốn có của thanh điều hướng lại cực kỳ trang nhã với một button "menu" rất đẹp mắt và đặc biệt hiển thị tốt trên hầu hết các thiết bị di động ngày nay.
1. Perspective Page View Navigation
![[TUT+] Navigation Menu - side menu](http://codropspz.tympanus.netdna-cdn.com/codrops/wp-content/uploads/2013/12/PerspectiveNavigation.png "[TUT+] Navigation Menu - side menu")
2. Transitions For Off-Cavas Navigation
![[TUT+] Navigation Menu - side menu](http://codropspz.tympanus.netdna-cdn.com/codrops/wp-content/uploads/2013/08/sidebartransitions.png "[TUT+] Navigation Menu - side menu")
3. Menu Transition In Effects
![[TUT+] Navigation Menu - side menu](http://www.webdesigncrowd.com/wp-content/uploads/2014/06/main_image.png "[TUT+] Navigation Menu - side menu")
4. Responsive Slide Toggle Menu
![[TUT+] Navigation Menu - side menu](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLoPCk46OnKnMFaGHc8dXbdpwv6ZNKfMkCIQ2WC18Ns5_fYExKtt69HywcYM-xJiXuWTzrmET5yXO7tMBy3jG_uDE25AB8dFN6nu8YhhYQ2UI0US1KOPx-4bMfAhZFeL7qa2VX2rRjUKE/s1600/side-nav.png "[TUT+] Navigation Menu - side menu")
5. Animated CSS3 Perspective Menu
![[TUT+] Navigation Menu - side menu](http://www.webdesigncrowd.com/wp-content/uploads/2013/09/main_image2.gif "[TUT+] Navigation Menu - side menu")
6. Closing Door Menu
![[TUT+] Navigation Menu - side menu](http://www.webdesigncrowd.com/wp-content/uploads/2014/07/main_image1.png "[TUT+] Navigation Menu - side menu")
7. Google Nexus Website Menu
![[TUT+] Navigation Menu - side menu](http://codropspz.tympanus.netdna-cdn.com/codrops/wp-content/uploads/2013/07/GoogleNexusMenu.png "[TUT+] Navigation Menu - side menu")
8. Slide and Push Menus
![[TUT+] Navigation Menu - side menu](http://codropspz.tympanus.netdna-cdn.com/codrops/wp-content/uploads/2013/04/BlueprintSlidePushMenus.jpg "[TUT+] Navigation Menu - side menu")
9. Simple YouTube Menu Effect
10. Animated Border Menus
![[TUT+] Navigation Menu - side menu](http://codropspz.tympanus.netdna-cdn.com/codrops/wp-content/uploads/2013/09/AnimatedBorderMenus.png "[TUT+] Navigation Menu - side menu")
TUTORIAL
DEMO
11. Circular Navigation
![[TUT+] Navigation Menu - side menu](http://codropspz.tympanus.netdna-cdn.com/codrops/wp-content/uploads/2013/08/CircularNavigation.png "[TUT+] Navigation Menu - side menu")
12. Multi-Level Push Menu
![[TUT+] Navigation Menu - side menu](http://codropspz.tympanus.netdna-cdn.com/codrops/wp-content/uploads/2013/08/MultiLevelPushMenu.png "[TUT+] Navigation Menu - side menu")
13. Slick Slide Side Navigation with jQuery and CSS3
![[TUT+] Navigation Menu - side menu](http://www.jqueryscript.net/images/Slick-Slide-Side-Navigation-with-jQuery-CSS3.jpg "[TUT+] Navigation Menu - side menu")
TUTORIAL
DEMO
14. Responsive Sliding Side Navigation with jQuery and CSS3
![[TUT+] Navigation Menu - side menu](http://www.jqueryscript.net/images/Responsive-Sliding-Side-Navigation-with-jQuery-CSS3.jpg "[TUT+] Navigation Menu - side menu")
TUTORIAL
DEMO
Hi vọng bài viết có ích cho các bạn!!!
Không có nhận xét nào :
Đăng nhận xét