1.1關鍵屬性
parallax: true(初始化時加上這一條，馬上就能開啟視差效果的大門)
data-swiper-parallax="-100"(動畫的平移值，一般為x)
data-swiper-duration="2000"（動畫持續時間）
可不止要注意這些屬性呢！！還有乙個屬性需要注意：
一般來說data-swiper-duration>speed才有效果,且speed不能太慢，一般在1000左右為宜，除非特殊要求
speed: 600(swiper切換所需時間)
1.2效果怎麼出來
有時候一邊調節位移，一邊調節時間，感覺好像沒什麼軟用，所以我們需要固定乙個值，去調節另乙個值
data-swiper-parallax="-1200" data-swiper-parallax-duration="2000"
data-swiper-parallax="-1000" data-swiper-parallax-duration="2000"
data-swiper-parallax="-1000" data-swiper-parallax-duration="1600"
data-swiper-parallax="-1000" data-swiper-parallax-duration="1200"
logo，分享，以及底部或側邊導航，這些都不會影響到內容區域,所以不需要縮放，有的按鈕本身就比較小也不需要縮放，這樣才能保證頁面在小屏下的清晰度
案例：像這個頁面：只有中間區域需要居中處理一下，調節margin來使具體的每一屏居中顯示
其他的都按照原來的定位來布局就可以了，
中間這一塊內容區域如果大於1200*700,可能就需要縮放了,
2.2@media vs resize 根據寬度縮放 vs 根據高度縮放 以及transition-origin具體採用何種方式需要檢視設計稿，如果內容較多但是內容之間空白比較多，或者內容比較集中的情況下可使用@media
2.2.1resize
比較難處理的就是resize,下面我們來說resize的乙個小案例:
content1:核心內容區域
content2:按鈕和標題區域，不縮放
content3:邊緣被切掉的，必須靠邊顯示
你會怎麼做？當content1核心區域縮放之後，其他區域只能通過找關係的方式進行定位值的計算,比如:
content2靠右定位，top值需要計算,獲取寬度不會受scale的影響，而offset會受其影響,用這種方式很容易也能求出content3的定位
2.2.2 根據寬度縮放 vs 根據高度縮放根據設計稿進行判斷，看哪個方向內容較多
PC端內容橫向滾動效果
想要實現的效果如下 首先要有乙個大的div，裡面包裹的內容可以左右移動。開始以為是很複雜的操作，查了相關資料發現很簡單，只需要操作css，都不需要自己寫js class scrollbox 的塊就是最外層的包裹塊 class blockdiv 的塊是通過v for迴圈產生多個 v if showbl...
什麼錄屏軟體好用？PC錄屏工具分享
什麼錄屏軟體好用？對於很多需要電腦錄屏的小夥伴來說，能夠找到乙個好用的錄屏軟體很重要。現在網上錄屏的方法有很多，不同的錄屏方法使用感之間有些差異。如果你也有電腦錄屏的需求，那下面分享的方法你需要知道！分享一 專業電腦錄屏軟體 如果需要錄製一些高質量的 建議使用 嗨格式錄屏大師 是一款適用於windo...
如何進行PC端多屏適配
這裡介紹一下 rem 適配方案 能夠流暢的適配不同解析度的螢幕，並且開發效率跟使用px開發沒什麼區別，只是多了將px轉化成rem的css函式 效果圖如下 可以看到在不同的解析度下，依然可以保持較好的布局 根據設計稿算出 px轉化成rem 的縮放比 這裡我的設計稿是 1920px，然後上面導航欄的字型...