免费css3技巧:时间线, Nexus 7, 滑动和菜单.

1.使用css3和jQuery的作品时间线

非常感谢tutorizlzine,在这篇教程中,我们可以看到一个由jQuery插件展示的作品事件的时间线。你可以添加很多种媒体类型,包括文章、视屏和地图等

In this great tutorial thanks to Tutorialzine we look at Timeline, a jQuery plugin specialized in showing a chronological series of events. You can embed all kinds of media including tweets, videos and maps, and associate them with a date.

See the demo of Timeline Portfolio

Go to the tutorial for Timeline Portfolio

————

2. css3和javascript的谷歌Nexus网站菜单

Google Nexus Website Menu with CSS3 & JavaScript

A tutorial on how to re-create the slide out sidebar menu that can be seen on the Google Nexus 7 website thanks to Codrops.

See the demo of the Google Nexus 7 slide out sidebar menu

Go to the tutorial for the Google Nexus 7 slide out sidebar menu

————

3. 怎样使用css3和jQuery创建一个简单的多个滑动

How To Create a simple multi-item slider with CSS3 & jQuery

Another excellent tutorial from Codrops on how to create a simple category slider with a minimal design using CSS animations and jQuery. The idea is to slide the items sequentially depending on the slide direction.

See the demo for a simple multi-item slider

Go to the tutorial for a simple multi-item slider

————

4. 多彩css动画导航菜单

Colorful CSS3 Animated Navigation Menu

In this short tutorial from Tutorialzine, we look at how to create a colorful dropdown menu using only CSS3 and the Font Awesome icon font.

See the demo for a colorful dropdown menu

Go to the tutorial for a colorful dropdown menu

 


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流