/圖/片可/以/斜/著/滾/動/了/
今天給大家說下關(guān)于 iPaiban Pro 黑科技編輯器更新的兩件事。
一件是模板的更新，上新了新組件。
之前編輯器有一個可以自動平移滾動的交互效果，我們可以選擇向左（編號：10888）、向右（編號：10889）、向上（編號：10891）或向下（編號：10890）滾動，大家在「組件」-「自動」-「平移」分類中可以找到。
但4個方向的滾動效果沒想到仍不能滿足大家的需求，于是我們剛剛上線了可以斜向滾動的交互效果，傾斜角度可以任意調(diào)整。
并且為了更好的視覺效果，斜向滾動是一屏顯示兩張輪播圖的，看看Demo：
傾斜【25度】：
另一件是功能的更新，增加了「最近更新」模塊。
之前每次上線新組件/組合時大家可能都不知道，現(xiàn)在在「最近更新」中可以看到60天內(nèi)上線的所有組件/組合了。
當(dāng)然，有不錯的新效果上線時還是會給大家在推文中及時推薦的，就比如今天的斜向滾動效果，這個效果在制作素材時也有一些特殊性，大家一起看下詳細(xì)使用教程吧。
工具：iPaiban Pro 黑科技編輯器，網(wǎng)址：x.iPaiban.com
組件：自動-斜向滾動(一屏顯示兩圖)
編號：11153（組件）第1步：選擇組件
登錄 iPaiban Pro 編輯器后，點(diǎn)擊編輯器右側(cè)「組件」按鈕，在「自動」-「平移」分類中找到「自動-斜向滾動(一屏顯示兩圖)」組件，點(diǎn)擊選擇。或者直接在搜索框中搜索組件編號11153。
第2步：上傳圖片素材
圖片素材制作時需要注意一下尺寸。我們先確定輪播圖的尺寸，所有輪播圖尺寸保持一致。
背景圖尺寸由輪播圖決定：寬度為單張輪播圖寬度的2倍，高度為單張輪播圖高度+單張輪播圖寬度*3tanθ。這里θ為我們要設(shè)置的傾斜角度。
這個是最佳尺寸，大家可以根據(jù)需要自由調(diào)整，不用強(qiáng)求。大家也不必理解公式的意義，只需知道這樣可以讓效果完美呈現(xiàn)就可以了。比如如果輪播圖的寬為500px，高為300px，設(shè)置傾斜角度45度，那么背景圖的寬度應(yīng)為500*2=1000px，高度應(yīng)為300+500*3*tan45°=1800px。
圖片制作好后，點(diǎn)擊右側(cè)「換圖」按鈕上傳背景圖，點(diǎn)擊「+」號上傳所有輪播圖。
第3步：調(diào)整滾動效果
滾動效果由「每張圖片切換時間」和「傾斜角度」兩部分組成，大家可根據(jù)需要自由設(shè)置。
第4步：導(dǎo)入公眾號后臺
點(diǎn)擊頁面最右側(cè)「預(yù)覽草稿」可隨時預(yù)覽效果，效果滿意后點(diǎn)擊「導(dǎo)入微信后臺」就能開始導(dǎo)到公眾號了。
導(dǎo)入時使用 iPaiban Pro 小助手更方便哦，最新版本的小助手已經(jīng)支持局部導(dǎo)入，安裝教程戳：《安裝教程》，使用教程戳：《使用教程》。
制作SVG交互圖文認(rèn)準(zhǔn) iPaiban Pro 黑科技編輯器，網(wǎng)址：x.iPaiban.com，復(fù)制網(wǎng)址在 PC 端 Chrome（谷歌）瀏覽器打開，即可開始注冊并使用。
新用戶在「新手禮包」可領(lǐng)取3天企業(yè)標(biāo)準(zhǔn)版會員體驗權(quán)，以及22個常用必備組件的大禮包（1年）哦。
一個互動
你還想要什么交互效果？
留言區(qū)聊聊
● SVG 黑科技交互排版????????
點(diǎn)個“在看”
戳沙小僧（playhudong033）
領(lǐng)取交互圖文案例庫15天會員
（含數(shù)千品牌的13000+案例）
轉(zhuǎn)載請在文章開頭和結(jié)尾顯眼處標(biāo)注：作者、出處和鏈接。不按規(guī)范轉(zhuǎn)載侵權(quán)必究。
未經(jīng)授權(quán)嚴(yán)禁轉(zhuǎn)載，授權(quán)事宜請聯(lián)系作者本人，侵權(quán)必究。
本文禁止轉(zhuǎn)載，侵權(quán)必究。
授權(quán)事宜請至數(shù)英微信公眾號(ID: digitaling) 后臺授權(quán)，侵權(quán)必究。
評論
評論
推薦評論
暫無評論哦，快來評論一下吧！
全部評論（0條）