微信公眾號 SVG長按互動

<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交互開發