昨天，微互動(dòng)群內(nèi)關(guān)于圖片滑動(dòng)的問(wèn)題引發(fā)了一系列的討論，雖然i排版編輯器上還木有更新圖片左右滑動(dòng)的樣式，但是7喜還是打算把代碼放出來(lái)給大家共享啦！
廢話不說(shuō)，先來(lái)示例：
示例一：靜態(tài)圖片 取經(jīng)之路
：按住圖片左右滑動(dòng)
示例二：動(dòng)態(tài)圖片 李7喜表情包
：按住圖片左右滑動(dòng)
實(shí)現(xiàn)方法
1. 打開(kāi)i排版編輯器；
2. 切換到</>模式，復(fù)制以下代碼粘貼進(jìn)去；
<section style="">
<p style="white-space: nowrap; overflow-x: scroll;">
<img style="width: 300px !important; margin-right: 5px; visibility: visible !important; height: auto !important;" data-ratio="0.6533333333333333" data-w="300" width="300px" src="圖片1網(wǎng)址" /> <img style="width: 300px !important; margin-right: 5px; visibility: visible !important; height: auto !important;" data-ratio="0.6533333333333333" data-w="300" width="300px" src="圖片2網(wǎng)址" /> <img style="width: 300px !important; visibility: visible !important; height: auto !important;" data-ratio="0.6533333333333333" data-w="300" width="300px" src="圖片3網(wǎng)址" />
</p>
</section>
3. 在i排版上傳圖片，把網(wǎng)址復(fù)制到上面代碼中圖片1網(wǎng)址、圖片2網(wǎng)址、圖片3網(wǎng)址相應(yīng)的位置；
4. 切回編輯模式，復(fù)制粘貼到微信編輯器；
5. 完畢
以上就是左右滑動(dòng)圖片的代碼啦，小伙伴們可以進(jìn)行嘗試編輯；i排版隨后也將上線相應(yīng)樣式，敬請(qǐng)期待！
如果還想學(xué)習(xí)上下滑動(dòng)代碼請(qǐng)關(guān)注微互動(dòng)和i排版的相關(guān)教程咯~
希望和你一起進(jìn)步的i排版
www.ipaiban.com
【征稿】
即日起i排版誠(chéng)征各種排版優(yōu)良的文章、賬號(hào)，歡迎大家推薦與自薦；一經(jīng)采納必有獎(jiǎng)勵(lì)，排版君還會(huì)將你的推薦展示給更多盆友哦！
i排版正在征集“微信百萬(wàn)大號(hào)養(yǎng)成記”調(diào)查問(wèn)卷，歡迎長(zhǎng)按二維碼跳轉(zhuǎn)填寫(xiě)~
聯(lián)系客服
