在開發(fā)制作SVG公眾號互動排版時，我們會經(jīng)常使用animate元素來實(shí)現(xiàn)動畫的效果，比如透明度變化（淡入淡出）、寬高大小的變化（慢慢下拉展開）等等，animate元素有些屬性可以設(shè)置多個數(shù)值（比如：values="1;0;0"），數(shù)值之間用英文符合隔開，但是在最后一個數(shù)值的結(jié)尾多寫一個英文分號（比如：values="1;0;0;"），這樣會導(dǎo)致animate元素在不同的手機(jī)操作系統(tǒng)上（Android和iOS）展示效果是不一樣的 ，今天我們一起來測試一下吧！

values、keyTimes、keySplines不多寫英文分號

顯示的結(jié)果：在Android系統(tǒng)和iOS系統(tǒng)上點(diǎn)擊顏色正常淡出

values屬性最后一個數(shù)值多寫一個英文分號

修改的代碼：values="1;0;0;"

顯示的結(jié)果：在Android系統(tǒng)和iOS系統(tǒng)上點(diǎn)擊顏色正常淡出

keyTimes屬性最后一個數(shù)值多寫一個英文分號

修改的代碼：keyTimes="0;0.5;1;"

顯示的結(jié)果：在Android系統(tǒng)上失效，代碼不執(zhí)行；在iOS系統(tǒng)上點(diǎn)擊顏色正常淡出

keySplines屬性最后一個數(shù)值多寫一個英文分號

修改的代碼：keySplines=".42,0,.58,1;.42,0,.58,1;"

顯示的結(jié)果：在Android系統(tǒng)上點(diǎn)擊顏色正常淡出；在iOS系統(tǒng)上失效，代碼不執(zhí)行；

懂點(diǎn)君的總結(jié)

給animate元素屬性設(shè)置多個數(shù)值時，最后一個數(shù)值的結(jié)尾不要添加分號，一定不要添加分號，否則會導(dǎo)致animate元素出現(xiàn)問題。