<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交互开发

微信公众号 SVG长按互动的更多相关文章

  1. 微信公众号开发C#系列-10、长链接转短链接

    1.概述 短网址的好处众多,便于记忆,占用字符少等,现在市面上出现了众多的将长网址转变为短网址的方法,但是由于他们都是小的公司在幕后运营,所以很不靠谱,面对随时关闭服务的可能,这样也导致我们将转换好了 ...

  2. 使用 Chrome 对长网页(知乎、微信公众号文章)进行完整截图

    当需要对一个较长的网页进行完整截图时,可以直接使用谷歌浏览器(Chrome)自带的截图功能完成,不需要依赖第三方截图软件. 1. 打开网页 以微信公众号的页面作为示例:https://mp.weixi ...

  3. svg微信公众号推文实现点击显示答案

    svg微信公众号推文实现点击显示答案 大家都知道微信公众号推文不能写js 所以不能加点击事件 其实是对的 确实不能写js 但是点击事件可以用svg写  svg代码可不会隐蔽 下面我直接贴代码 < ...

  4. 微信公众号开发之access_token的全局共用

    最近做微信公众号开发,涉及到access_token的缓存问题(避免各自的应用都去取access_token,同时解决微信 appid和appsecret的安全问题),在通用权限管理系统底层增加了实现 ...

  5. 微信公众号发送客服消息提示errcode":45015,"errmsg":"response out of time limit or subscription is canceled hint:解决办法【已解决】

    微信公众号发送客服消息提示errcode":45015,"errmsg":"response out of time limit or subscription ...

  6. 用java开发微信公众号:公众号接入和access_token管理(二)

    本文为原创,原始地址为http://www.cnblogs.com/fengzheng/p/5027630.html 上一篇说了微信开发的准备工作,准备工作完成之后,就要开始步入正题了.其实微信公众号 ...

  7. C#开发微信门户及应用(37)--微信公众号标签管理功能

    微信公众号,仿照企业号的思路,增加了标签管理的功能,对关注的粉丝可以设置标签管理,实现更加方便的分组管理功能.开发者可以使用用户标签管理的相关接口,实现对公众号的标签进行创建.查询.修改.删除等操作, ...

  8. 皮裤原理和运营微信公众号dotNET跨平台

    经常碰到有同学对.NET跨平台存在各种疑惑和误解,原因是什么呢?当然我是知道.NET的跨平台不是问题,而且微软2014年的努力可圈可点,而且还有很多人对.NET的前景感到困惑.春节期间突然明白了,这就 ...

  9. 【原创】【2015最新】微信公众平台开发手把手入门之一:缘起微信公众号(PHP,MYSQL, BAE)

    最近因为业务的需要,老板布置做了两个月简单的的微信公众平台开发,从网上搜了一些资料,实话说资料不多. 在参考学习的过程中也遇到了不少难缠的小问题,虽然不难逾越,但是确实浪费了时间. 我发现网上仅有不多 ...

随机推荐

  1. scala 常用模式匹配类型

    模式匹配的类型 包括: 常量模式 变量模式 构造器模式 序列模式 元组模式 变量绑定模式等. 常量模式匹配 常量模式匹配,就是在模式匹配中匹配常量 objectConstantPattern{ def ...

  2. fastReport.net 初了解

    delphi 中fastReport rmReport都很好用,转到.net了,第一想法也是这两个,好在这里有个fastReport; 这个安装呢 找个破解的 有个4.x版 安完建一个winForm  ...

  3. Android笔记之调用系统相机拍照

    参考链接: 拍照  |  Android Developers, Android相机拍照方向旋转的解决方案:ExifInterface - 简书 Demo链接:https://pan.baidu.co ...

  4. CSS 命名规范将省下调试时间

    我听说很多开发者厌恶 CSS.而在我的经验中,这往往是由于他们并没有花时间来学习 CSS. CSS 算不上是最优美的『语言』,但迄今二十多年来,它都是美化 web 举足轻重的工具.从这点来说,也还算不 ...

  5. drupal7 代码生成用户,并自动登录

    直接上代码 1. 生成用户(注册) $edit = [ "name" => "name", "pass" => "pa ...

  6. css----less预处理器

    ###less less是一种动态样式语言,属于css预处理器的范畴,它扩展了 CSS 语言, 增加了变量.Mixin.函数等特性,使 CSS 更易维护和扩展 LESS 既可以在 客户端 上运行 ,也 ...

  7. 解析Spring第二天

    目的:使用spring中纯注解的方式 前言:同样是使用idea创建一个普通的maven工程(如何创建一个普通的Maven工程可以参考mybatis入门第一天的详解). bean管理类常用的4个注解(作 ...

  8. 【转载】opencl中设备内存

    地址空间限定符 一般的内核代码中,里面的内核参数或声明变量时,都会有地址空间限定符 地址空间限定符,地址空间限定符的主要作用是指出数据应该保存在哪个地方 地址空间限定符有4个: 全局内存: 限定符:_ ...

  9. Jmeter插件:jp@gc - Dummy Sampler

    Dummy Sampler可以比较方便地模拟测试场景,自定义Request Data和Response Data 1. 安装插件:打开页面插件管理网站,下载plugins-manager.jar. 在 ...

  10. java编程规约一

    提高开发效率,比较重视代码规范,尤其是可扩展性和可维护性,以及可读性.如果你是一个刚进公司的开发者,最好先问问前辈是否有 内部的开发规范,花点时间过一遍.即使提交代码没有review的步骤,自己心里应 ...