源项目地址:https://github.com/bradtraversy/50projects50days 源项目 demo 地址:https://50projects50days.com/
- day01:Expanding Cards:展开卡片
- day02:Progress Steps:进度条
- day03:Rotating Navigation Animation:旋转的导航栏动画
- Font Awesome 参考手册:https://www.runoob.com/font-awesome/fontawesome-reference.html
- day04:Hidden Search Widget:隐藏搜索框工具
- day05:Blurry Loading:模糊加载
- day06:scroll-animation:滚动动画
- day07:Split Landing Page:分离切换效果
- day08:Form Input Wave:表单输入及动画
- day09:Sound Board:音板
- day10:Dad Jokes:冷笑话
- day11:Event KeyCodes:事件对象按键相关属性
- day12:Faq Collapse:问题折叠卡片
- day13:Random Choice Picker:随机选项标签创建
- day14:Animated Navigation:动画导航
- day15:Incrementing Counter:自增数字效果
- day16:Drink Water:记录喝水效果
- day18:Background Slider:背景轮播
- day19:Theme Clock:主题时钟
- day20:Button Ripple Effect:涟漪按钮
- day21:Drag N Drop:拖拽卡片
- day22:Drawing App:canvas 画板
- day23:Kinetic Loader:加载动画
- day24:Content Placeholder:内容占位符（骨架屏）
- day25:Sticky Navigation:响应式导航栏
- day26:Double Vertical Slider:双向垂直滑块
- day27:Toast Notification:面包屑消息通知
- day28:Github Profiles:github 搜索（用户简介）
- day29:Double Click Heart:双击点赞
- day30:Auto Text Effect:自增文字效果
- day31:Password Generator:密码生成器
- day32:Good Cheap Fast:自定义 checkbox
- day33:Notes App:网页便笺
- day34:Animated Countdown:动画倒计时效果
- day35:Image Carousel:轮播图
- day36:HoverBoard:鼠标滑动涟漪
- day38:Mobile Tab Navigation:移动端导航栏
- day40:3d Background Boxes:3d 背景图片
- day41:Verify Account Ui:验证码输入框 UI
- day42:Live User Filter:列表筛选
- day43:Feedback Ui Design:意见反馈 UI
- day44:Custom Range Slider:自定义滑块
- day45:Netflix Mobile Navigation:侧边导航栏
- day46:Quiz App:问答框
- day47:Testimonial Box Switcher:简介卡片
- day48:Random Image Feed:随机图片+懒加载
- day49:ToDoList:待办清单
- day50:Insect Catch Game:捉虫游戏
- 收官！