【公眾號(hào)排版】如何使用SVG組件制作拆盲盒和問(wèn)答解析效果
掌握SVG組件的神奇力量，輕松實(shí)現(xiàn)公眾號(hào)文章中的互動(dòng)效果！本文詳細(xì)介紹了如何使用135編輯器中的SVG組件來(lái)創(chuàng)建拆盲盒和問(wèn)答解析效果，包括詳細(xì)的操作步驟和技巧。立即學(xué)習(xí)如何為你的新媒體運(yùn)營(yíng)增添動(dòng)力，提升用戶體驗(yàn)，讓內(nèi)容更具吸引力。
快點(diǎn)擊足球盲盒，看看你能領(lǐng)取到什么樣的足球手辦（只有一次機(jī)會(huì)哦，想要再拆盲盒需要刷新文章）
覺(jué)得盲盒不盡興，還想再來(lái)點(diǎn)別的？沒(méi)問(wèn)題三兒也為你準(zhǔn)備了，快來(lái)測(cè)一測(cè)你是屬于哪種花吧??
注：此效果不能實(shí)現(xiàn)【返回】，所以很適合“抽獎(jiǎng)”、“單項(xiàng)選擇”等具有唯一性的事件。
#在135編輯器左側(cè)入口中進(jìn)入svg編輯器。
#或是直接在瀏覽器中輸入svg編輯器官網(wǎng)網(wǎng)址進(jìn)入：
http://syjsm.cn/
#查找組件我們一般有兩種思路：
一是直接輸入組件ID，準(zhǔn)確、快捷但前提是你能記住每個(gè)組件的ID；
二是根據(jù)效果來(lái)選擇，我們這個(gè)效果很明顯是一個(gè)【點(diǎn)擊】效果，那么我們?cè)诜诸愔羞x擇【點(diǎn)擊】
#我們可以看到關(guān)于【單擊】的效果組件有許多，就需要我們慢慢查找了。
#找到我們本次需要使用的效果組件：?jiǎn)芜x答案解析類答題效果 組件id：189
#將組件添加至編輯區(qū)域。
#在我們添加圖片時(shí)，我們一定要看素材要求，根據(jù)要求制作圖片，這樣才能確保效果的完美展示。
#制作完符合素材要求的圖片后，我們就可以添加【背景圖】和答案圖片了。
背景圖示例??
答案圖示例??
#每上傳一張【答案圖】時(shí)，背景圖都會(huì)對(duì)應(yīng)顯示一個(gè)紅色的選項(xiàng)熱區(qū)，將這個(gè)熱區(qū)移動(dòng)到【背景圖】對(duì)應(yīng)的位置，調(diào)整好觸發(fā)區(qū)域大小，即可實(shí)現(xiàn)點(diǎn)擊該區(qū)域顯示上傳的答案圖??
#設(shè)置完成后的svg文章效果可以通過(guò)使用【同步】或【導(dǎo)出】功能，保存到微信公眾號(hào)平臺(tái)
以上就是
【單選答案解析類答題效果】
全部?jī)?nèi)容啦
看會(huì)了的小伙伴
今天就操練起來(lái)
給領(lǐng)導(dǎo)一個(gè)驚喜和一個(gè)漲薪的理由吧
下一期你還想學(xué)什么
可以在評(píng)論區(qū)留言哦
明天見(jiàn)~
·END·
文章排版由135編輯器提供技術(shù)支持
■ ■ ■ ■
立即登錄
