页面切换特效(无依赖)

该效果主要解决从第一页切换到第二页的效果

1. 页面主要Dom结构



  
    
    
  
  
      

2. 效果

2.1 向上滑入
向上滑入
2.2 向左滑入
向左滑入
2.3 向左放大滑入
向左放大滑入
2.4 向上放大滑入
向上放大滑入
2.5 左上放大滑入
左上放大滑入
2.6 左下放大滑入
左下放大滑入
2.7 右上放大滑入
右上放大滑入
2.8 右下放大滑入
右下放大滑入
2.9 淡入
淡入
2.10 百叶窗
百叶窗

3. 知识点

  • dom 增删 appendChild,remove
  • dom 控制属性
  • dom 控制样式
  • css animation
  • clip 切割区域

你可能感兴趣的:(页面切换特效(无依赖))