fisherwu29 / webproject

记录我在学习前端过程中做过的小demo(都没有适配移动客户端，建议在桌面浏览器中打开)，此项目会持续更新，你可以点击下面的链接查看目录

目录中的项目都可以在我的 Github 中找到，下面给出各个项目的地址。

1. Canvas 滤镜： 在本项目的 CanvasClip 目录下

2. HTML5音乐播放器： https://github.com/hwaphon/HTML5MusicPlayer

3. HTML5便签小应用： https://github.com/hwaphon/Html5LocalStorage

3.1 HTML5便签小应用升级版： https://github.com/hwaphon/Html5LocalStorage

4. Canvas 绘制图案： https://github.com/hwaphon/Html5Canvas

5. 3D旋转演示：在本项目的 3dRotateDemo 目录下

6. 3D翻页效果: 在本项目的 3dPaging 目录下

7. hover 效果：在本项目的 TransitionDemo 目录下

8. 照片折叠效果: 在本项目的 TransitionDemo 目录下

9. 曲线阴影和翘边阴影：在本项目的 PhotoShadow 目录下（不过需要注意的是，父级设置了relative，子元素设置了absolute，且均设置了z-index属性值的时候，父级对子元素的层级有限制（即不论子元素z-index值大小，层级不“正常”显示）。如果将父级的层级设置为：z-index：auto，或者父级不设置z-index属性，则子元素的z-index不受父级限制，即正常显示。）

10. 贝塞尔曲线实现弹性效果： 在本项目的 TransitionDemo 目录下

11. 3D 旋转球形： 在本项目的 3dRotateDemo 目录下

12. 3D 旋转立方体： 在本项目的 3dRotateDemo 目录下

13. 自定义日历控件： 在本项目的 Calendar 目录下

14. Browse Happy: 在本项目的 browseHappy 目录下

15. 拼图游戏: 在本项目的 pintu 目录下

16. 垂直时间轴（响应式）: 在本项目的 VerticalTimeline 目录下，详情可查看博客 Building a Vertical Timeline With CSS and a Touch of JavaScript

17. 水平时间轴(响应式+支持左滑右滑+支持左右方向键): 在本项目的 HorizontalTimeline 目录下。