模板效果

点击查看效果

模板代码

<!-- 最底层 -->
<section style="display: inline-block;vertical-align: top;width: 100%;background-position: 0 0;background-repeat: no-repeat;background-size: 100% auto;background-attachment: scroll;background-image: url(https://mmbiz.qpic.cn/mmbiz_png/JpraGu7eGqTUyPb4VU7nbAWOcvLWqpF7YUmGh31wvNo1AYr1oUDf6Ky6xjxx7WEDVGIVyPyCXKHIXvbic6icicichA/0?wx_fmt=png);" powered-by="公众号：懂点君">
    <!-- 中间层 -->
    <section style="height: 0;" powered-by="公众号：懂点君">
        <section style="width: 100%;overflow-x: auto;-webkit-overflow-scrolling: touch;">
            <section style="width: 278%;max-width: 278% !important;">
                <svg style="display: inline-block;vertical-align: top;width: 100%;background-image: url(https://mmbiz.qpic.cn/mmbiz_png/JpraGu7eGqTUyPb4VU7nbAWOcvLWqpF7YV6ialH4cIbMH5mVVtm3TdEJY96D9Uic5tfuazkteVqYv64kctdkfichg/0?wx_fmt=png);background-position: 0 0;background-size:100% auto;background-repeat: no-repeat;" viewBox="0 0 3000 1687"></svg>
            </section>
        </section>
    </section>
    <!-- 最前面的一层 -->
    <section style="transform: scale(1);width: 100%;background-position: 0 0;background-repeat: no-repeat;background-size: 100% auto;background-attachment: scroll;background-image: url(https://mmbiz.qpic.cn/mmbiz_png/JpraGu7eGqTUyPb4VU7nbAWOcvLWqpF7CgwshEiazQg6AGaCuNxWmE1rDSIJZcY8eOW2MA3Jfk2G7ykmcrQiba1g/0?wx_fmt=png);pointer-events:none;" powered-by="公众号：懂点君">
        <!-- SVG这个代码主要用于撑开高度 -->
        <svg style="display: inline-block;vertical-align: top;" viewBox="0 0 1080 1687"></svg>
    </section>
</section>