“在圖文里播放音頻，可以去掉音頻的懸浮窗嗎？”
點(diǎn)擊圖片，播放音頻。
這種效果大家很常見(jiàn)了。相比于直接點(diǎn)擊播放音頻卡片，在長(zhǎng)圖排版中這種播放音頻的方式顯然更好一些。
不過(guò)不少追求完美的小伙伴，還是覺(jué)得點(diǎn)擊后彈出的小懸浮窗會(huì)影響沉浸閱讀的效果。如下：
那么，如何將音頻的懸浮彈窗去掉呢？
或許，我們可以換種音頻上傳的方式。把要播放的音頻以視頻的形式上傳，然后隱藏在圖片之下，音頻的懸浮窗自然就沒(méi)有啦。
*素材來(lái)自石頭科技roborock《黑科技！會(huì)「伸手」 的 P10 Pro 來(lái)了！》
組件：點(diǎn)擊切換圖片+播放音頻(以視頻方式上傳)
編號(hào)：11354（組件）
*素材來(lái)自大眾汽車(chē)《夏日趣放送丨隨耳朵趣逐浪》
組件：點(diǎn)擊切換圖片+播放音頻(以視頻方式上傳)
編號(hào)：11354（組件）
這2個(gè)案例用到的效果就是使用 iPaiban Pro 黑科技編輯器里的「點(diǎn)擊切換圖片+播放音頻(以視頻方式上傳)」組件（編號(hào)11354）制作的。
相比純音頻，以視頻方式上傳的支持直接轉(zhuǎn)載，點(diǎn)擊播放時(shí)不會(huì)彈出懸浮彈窗，更方便干凈。
下面以案例1為例，來(lái)看看是如何制作的吧。
詳細(xì)教程：
工具：iPaiban Pro 黑科技編輯器，網(wǎng)址：SVG.iPaiban.com
組件：點(diǎn)擊切換圖片+播放音頻(以視頻方式上傳)
編號(hào)：11354（組件）
第1步：選擇組件
登錄 iPaiban Pro 編輯器后，點(diǎn)擊編輯器右側(cè)「組件」按鈕，在「音頻」-「視頻式音頻」分類(lèi)中找到「點(diǎn)擊切換圖片+播放音頻(以視頻方式上傳) 」組件，或者直接在搜索框中搜索組合編號(hào)11354，點(diǎn)擊選擇。
第2步：上傳圖片
點(diǎn)擊右側(cè)換圖上傳點(diǎn)擊前和點(diǎn)擊后的圖片，若圖片上傳錯(cuò)誤，還可點(diǎn)擊換圖進(jìn)行調(diào)整。
第3步：調(diào)整觸發(fā)區(qū)域
拖拽紅色區(qū)域調(diào)整觸發(fā)區(qū)域的位置。為了防止點(diǎn)擊觸發(fā)時(shí)有問(wèn)題，這里限制觸發(fā)區(qū)域的大小不可調(diào)整，只能調(diào)整位置。
第4步：輸入視頻id
①在公眾號(hào)后臺(tái)新建圖文，將要使用的視頻插入。
②點(diǎn)擊頁(yè)面右上角 iPaiban Pro 小助手插件（安裝和詳細(xì)使用教程），選擇「本地視頻」提取id。
③復(fù)制提取到的視頻id，返回到編輯器中，粘貼在指定位置。
第5步：導(dǎo)入公眾號(hào)后臺(tái)
該效果不支持在編輯器預(yù)覽。點(diǎn)擊「同步至微信后臺(tái)」等待同步成功，然后掃碼預(yù)覽效果即可。
使用同步功能無(wú)需頻繁在編輯器和微信后臺(tái)切換，同步成功后可以立即掃描二維碼查看。
轉(zhuǎn)載請(qǐng)?jiān)谖恼麻_(kāi)頭和結(jié)尾顯眼處標(biāo)注：作者、出處和鏈接。不按規(guī)范轉(zhuǎn)載侵權(quán)必究。
未經(jīng)授權(quán)嚴(yán)禁轉(zhuǎn)載，授權(quán)事宜請(qǐng)聯(lián)系作者本人，侵權(quán)必究。
本文禁止轉(zhuǎn)載，侵權(quán)必究。
授權(quán)事宜請(qǐng)至數(shù)英微信公眾號(hào)(ID: digitaling) 后臺(tái)授權(quán)，侵權(quán)必究。
評(píng)論
評(píng)論
推薦評(píng)論
暫無(wú)評(píng)論哦，快來(lái)評(píng)論一下吧！
全部評(píng)論（0條）