<section class="" style="display: block;width: 100%;height:667px;overflow:hidden;margin-top: -1px;vertical-align: top;background-position: 0% 0%;background-repeat: no-repeat;background-size: 100%;background-attachment: scroll; background-image: url(‘http://test.houjt.cn/userproject/cjytest/svg/img/10-23/1.gif‘); -webkit-tap-highlight-color: transparent;user-select: none;"> <svg enable-background="new 0 0 750 1334" space="preserve" style="display: block;width: 100%;height:667px;vertical-align: top;background-position: 0% 0%;background-repeat: no-repeat;background-size: 100%;background-attachment: scroll; background-image: url(‘http://test.houjt.cn/userproject/cjytest/svg/img/10-23/1.jpg‘); -webkit-tap-highlight-color: transparent;" version="1.1" viewBox="0 0 750 1334" x="0px" xlink="http://www.w3.org/1999/xlink" xml="" xmlns="http://www.w3.org/2000/svg" y="0px"> <animate attributeName="opacity" values="1;1;0" begin="touchstart" end="touchend" dur="1.5s" keyTimes="0;.3;1" fill="freeze" restart="whenNotActive"></animate> <animate attributeName="opacity" begin="touchend" to="1" dur="1.5s" fill="freeze" restart="whenNotActive"></animate> </svg> </section>
把代码复制到135编辑器可以手机扫描生成的预览二维码码查看实际效果。
P.S. 预览二维码要内容里有文字才能生成,单纯放svg标签而没有文字内容,135编辑器是生成不了预览二维码的,如果生成不了码,就在上面随便打几个字在试试
参考链接:
详细教你微信公众号正文页SVG交互开发
原文地址:https://www.cnblogs.com/haqiao/p/11731064.html
时间: 2024-11-10 01:24:20