連續點擊旋轉切換，能調角度和快慢！
之前小編在《新年新效果，2021旋轉一下變2022！》中講過旋轉切換圖片的效果，講得都是在圖片的某一角為圓點旋轉切換，并且只能點擊切換一次。
最近許多小伙伴希望可以有以圖片下邊中點為圓點旋轉切換的，并且可以連續點擊切換，就像下方 Weekend Max Mara 一篇圖文中的這樣：
當然可以！
現在 iPaiban Pro 編輯器上線了多個相關組件，旋轉方向可以選擇順時針或逆時針，每個方向的包含以上、下、左、右4個中點為圓點旋轉的，還可以調整觸發區、旋轉快慢以及旋轉角度。
觸發區和旋轉快慢大家都應該明白，旋轉角度是什么？有什么用？
舉個例子，下方鞋子在靜止狀態下可以看到前后切換圖，調大旋轉角度后前后切換圖就不會露出了，有時候我們也可以故意露出前后切換圖，效果可能更好一些，這就是旋轉角度的作用。
組件：連續點擊-圖片順時針旋轉切換(下、有觸發區)
編號：11283（組件）
旋轉角度45度
組件：連續點擊-圖片順時針旋轉切換(下、有觸發區)
編號：11283（組件）
旋轉角度60度
再試試以圖片上邊中點為圓點旋轉切換的：
組件：連續點擊-圖片順時針旋轉切換(上、有觸發區)
編號：11282（組件）
旋轉角度45度
另外還有組件「 連續點擊-圖片順時針旋轉切換(左、有觸發區)」（編號：11284）、「連續點擊-圖片順時針旋轉切換(右、有觸發區)」（編號：11285）等。
更多相關組件大家可以在「點擊」-「旋轉切換」分類中找到，或者直接搜索關鍵詞「連續 旋轉」。
一起看下制作教程：
詳細教程：
工具：iPaiban Pro 黑科技編輯器，網址：x.iPaiban.com
組件：連續點擊-圖片順時針旋轉切換(下、有觸發區)
編號：11283（組件）
第1步：選擇組件
登錄 iPaiban Pro 編輯器后，點擊編輯器右側「組件」按鈕，在「點擊」-「旋轉切換」分類中找到「連續點擊-圖片順時針旋轉切換(下、有觸發區)」組件，或者直接在搜索框中搜索組件編號11283，點擊選擇。
第2步：上傳圖片素材
點擊右側「換圖」按鈕上傳背景圖，點擊右側「+」號上傳多張切換圖：
背景圖和所有切換圖尺寸需保持一致。
第3步：設置觸發區域和旋轉效果
雙擊編輯區的圖片，在彈出的窗口中紅色色塊表示觸發區域，可任意調整位置和大小。
我們將紅色色塊調整至合適區域后，點擊「下一張」繼續調整下一張的觸發區，如果所有圖片的觸發區相同，調整好第一張后直接點擊「為所有圖片的應用此配置」即可。
在右側可以調整旋轉切換的時間以及角度：
點擊頁面最右側「預覽草稿」可隨時預覽效果。
第4步：導入公眾號后臺
效果滿意后接著點擊「同步至微信后臺」同步到自己的公眾號就可以了。
局部導入可參考：《iPaiban Pro小助手v2.0安裝和使用教程》
制作SVG交互圖文認準 iPaiban Pro 黑科技編輯器，網址：x.iPaiban.com，復制網址在 PC 端 Chrome（谷歌）瀏覽器打開，即可開始注冊并使用。
新用戶在「新手禮包」可領取3天企業標準版會員體驗權，以及22個常用必備組件的大禮包（1年）。隨禮包附贈千元優惠券，每單最高立降500元。
有獎互動
你還想要什么交互效果？
留言區聊一聊
精選放出就送SVG案例庫高級會員1個月
（案例庫收錄案例數已達10W+）
● SVG 黑科技交互排版????????
·
轉載請在文章開頭和結尾顯眼處標注：作者、出處和鏈接。不按規范轉載侵權必究。
未經授權嚴禁轉載，授權事宜請聯系作者本人，侵權必究。
本文禁止轉載，侵權必究。
授權事宜請至數英微信公眾號(ID: digitaling) 后臺授權，侵權必究。
評論
評論
推薦評論
暫無評論哦，快來評論一下吧！
全部評論（0條）