@視差動畫

動態 列表
@baby7_68bfdb7205674

Vue視差標題背景

一、説明 這個我是為了放在博客的標題部分作為背景圖,上下滾動的時候比較好看。 原理就是通過幾張透明的png進行疊加,然後在上下滾動時,外層png移動的快,內層png移動得慢來實現視差效果。 先放一張示意圖: 這裏實際的距離X和Y在觀察者看來是一樣的,原因是距離觀察者的距離Z不一樣導致的。 再放一張視差標題背景的3d示意圖: 二、Vue代碼 這裏為了代碼高亮分三部分展示 html部分