閱文無數,看了這么多的SVG黑科技,我只服這一種!

胖友們大家好啊,我是三兒。上周三兒跟大家介紹了《新媒體の顏色挑戰》這篇SVG的制作方法,有胖友說看著挺高大上的,其實不就是一個點擊換圖的效果嘛?

image.png


沒錯!經??碐Q實驗室、三三星球、卡地亞、喜茶這些大號的胖友們應該有發現,現在很多文章里看起來很酷炫又唬人的SVG都可以歸納為點擊換圖效果。


像前兩年人民日報爆火的《點亮武漢》、135編輯器里的答題SVG、抽簽SVG等等也都是由點擊換圖效果演變來的。


今天三兒就來跟大家盤點10個有趣又好玩的點擊換圖玩法,只有你想不到,沒有SVG玩不了的




SVG使用須知


使用以下SVG需要通過135編輯器左側入口進入SVG編輯器;



在SVG編輯器中搜索ID或者關鍵詞,找到對應的SVG組件進行使用;



鼠標移動到SVG組件上,可以查看SVG的使用教程,也可以掃碼預覽SVG的具體效果。





點擊抽簽


·





ID:79


效果介紹:點擊抽簽封面圖,封面圖消失,簽文自動滾動,點擊滾動停止,隨機出現一張簽文圖片。



點擊翻轉卡片


·


ID:80


效果介紹:點擊圖片,觸發翻牌效果,顯示另外一張圖。



點擊翻書


·


ID:81


效果介紹:設置觸發區域,以翻書的形式實現圖片的切換,可以進行多張圖片的切換。


點擊左右開門


·


ID:82


效果介紹:點擊上層兩張圖片,圖片分別向左右兩邊打開,露出底圖。


點擊放大拍照


·





ID:83


效果介紹:點擊模擬拍照效果切換圖片,底部的圖片自動放大,可以用于放大圖片查看細節等創意。


水波式點擊換圖


·


ID:116


效果介紹:點擊A圖,A圖漸隱消失消失B圖,切換過程中出現圓形波紋擴散的效果。


毛玻璃點亮圖片


·


ID:124


效果介紹:點擊圖片,毛玻璃遮罩效果豎向移出,可設置上下移出方向和毛玻璃清晰度。


黑白濾鏡點亮圖片


·


ID:125


效果介紹:點擊圖片,黑白遮罩效果豎向移出,可以設置上下移出方向。


多次點擊放大換圖


·
·


ID:161


效果介紹:多次點擊切換多張圖片,每次點擊后的圖片以放大的方式出現??梢杂米骶植考毠澐糯蟮葎撘鈭D文。


多圖點擊豎向移入


·
·

·

·

·


ID:167


效果介紹:點擊A圖,A圖移出B圖移入,以此類推,移動方向為豎向,可以設置背景。這種效果可以制作成SVG歌詞海報、電影海報等。


好啦,以上就是三兒給大家介紹的點擊換圖的花式玩法了,大家還有沒有什么創意的點子,快來留言區告訴三兒呀。


·EN

文章排版由135編輯器提供技術支持

 ■ ■ 

文章申明:本文章轉載自互聯網公開渠道,如有侵權請聯系我們刪除
文章評價
登錄后可以評論
立即登錄
小三兒135主筆
一個酷愛鉆研排版的小編!
共606篇文章
最近文章
更多
  • 2023霜降節氣海報合集,給你專屬秋天的靈感!
  • 寒露節氣免費手機海報模板分享
  • 2023中秋節精美海報大放送,尊的都很好看!
  • 不看會后悔系列!2023國慶節精美海報模板分享!
比格設計
熱門工具
135編輯器
領先的在線圖文編輯平臺原創樣式素材,一鍵套用
筆格設計
受歡迎的在線作圖網站,新媒體配圖、手機海報應有盡有
筆格PPT
輸入主題,AI一鍵生成PPT;上傳本地文件秒變PPT
管小助
企業營銷、私域流量運營——站式營銷管理平臺
推薦文章
用戶運營平臺產品設計指南
淺談用戶運營中的用戶分層
內容運營:戴上寫作的六頂思考帽
5000字方法論:4個細節,決定私域能不能賺錢
一個案例說明白用戶分析怎么用
22條視頻,漲粉12.6萬,一個女孩子在抖音靠洗車也能月入過萬!
高價值社群的5大核心關鍵
抖音賬號內容自檢清單!
決定離職后,3天拿到offer的總結與反思!
【135早資訊】:教育部將徹查教材插圖問題;抖音6月1日起將對本地生活商家收取服務費
熱門素材樣式
運營導航
運營工具
分享到
2020精品自拍视频曝光_久久最新地址免费_紧身裙教师中文字幕在线一区_免费国产一级特黄aa大