微信公众号 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交互开发
微信公众号 SVG长按互动的更多相关文章
- 微信公众号开发C#系列-10、长链接转短链接
1.概述 短网址的好处众多,便于记忆,占用字符少等,现在市面上出现了众多的将长网址转变为短网址的方法,但是由于他们都是小的公司在幕后运营,所以很不靠谱,面对随时关闭服务的可能,这样也导致我们将转换好了 ...
- 使用 Chrome 对长网页(知乎、微信公众号文章)进行完整截图
当需要对一个较长的网页进行完整截图时,可以直接使用谷歌浏览器(Chrome)自带的截图功能完成,不需要依赖第三方截图软件. 1. 打开网页 以微信公众号的页面作为示例:https://mp.weixi ...
- svg微信公众号推文实现点击显示答案
svg微信公众号推文实现点击显示答案 大家都知道微信公众号推文不能写js 所以不能加点击事件 其实是对的 确实不能写js 但是点击事件可以用svg写 svg代码可不会隐蔽 下面我直接贴代码 < ...
- 微信公众号开发之access_token的全局共用
最近做微信公众号开发,涉及到access_token的缓存问题(避免各自的应用都去取access_token,同时解决微信 appid和appsecret的安全问题),在通用权限管理系统底层增加了实现 ...
- 微信公众号发送客服消息提示errcode":45015,"errmsg":"response out of time limit or subscription is canceled hint:解决办法【已解决】
微信公众号发送客服消息提示errcode":45015,"errmsg":"response out of time limit or subscription ...
- 用java开发微信公众号:公众号接入和access_token管理(二)
本文为原创,原始地址为http://www.cnblogs.com/fengzheng/p/5027630.html 上一篇说了微信开发的准备工作,准备工作完成之后,就要开始步入正题了.其实微信公众号 ...
- C#开发微信门户及应用(37)--微信公众号标签管理功能
微信公众号,仿照企业号的思路,增加了标签管理的功能,对关注的粉丝可以设置标签管理,实现更加方便的分组管理功能.开发者可以使用用户标签管理的相关接口,实现对公众号的标签进行创建.查询.修改.删除等操作, ...
- 皮裤原理和运营微信公众号dotNET跨平台
经常碰到有同学对.NET跨平台存在各种疑惑和误解,原因是什么呢?当然我是知道.NET的跨平台不是问题,而且微软2014年的努力可圈可点,而且还有很多人对.NET的前景感到困惑.春节期间突然明白了,这就 ...
- 【原创】【2015最新】微信公众平台开发手把手入门之一:缘起微信公众号(PHP,MYSQL, BAE)
最近因为业务的需要,老板布置做了两个月简单的的微信公众平台开发,从网上搜了一些资料,实话说资料不多. 在参考学习的过程中也遇到了不少难缠的小问题,虽然不难逾越,但是确实浪费了时间. 我发现网上仅有不多 ...
随机推荐
- windows下装LINUX后,进不了系统
在网上找了一款叫"DisckGenius"的软件,运行后选“硬盘”/“重建主引导记录(MBR)”,然后重启,就正常了. 还有系统盘最好是FAT32格式的.
- vue axios springBoot 跨域session丢失
前端: 在引入axios的地方配置 axios.defaults.withCredentials=true,就可以允许跨域携带cookie信息了,这样每次发送ajax请求后,只要不关闭浏览器,得到的s ...
- 2018湘潭大学程序设计竞赛【D】
题目链接:https://www.nowcoder.com/acm/contest/105/D 题意:就是数的fib表示方法.按权展开,又按二进制算出结果输出. 题解:贪心和数论吧.找到跟数最接近的f ...
- nio读取文件,输出文件
io流的一种: package com.cxy.ssp.Automic; import java.io.FileOutputStream; import java.io.IOException; im ...
- log4j.rootLogger
log4j.rootLogger=INFO, FILE, CONSOLE log4j.rootLogger=TRACE, FILE, CONSOLE
- 2019 Multi-University Training Contest 7 Kejin Player 期望dp
题目传送门 题意:有n个等级,在每个等级花费$ai$的代价有$pi$的几率升到$i+1$级,$1-pi$的概率降级降到$xi$(xi<=i),给出q次询问,每次询问从$l$级到$r$级的代价的期 ...
- vue v-model :
v-model : 通过v-model 进行双向绑定 ,将data的数据与input 绑定在一起,呈现在页面上 <!DOCTYPE html> <html lang="en ...
- scala 中List的简单使用
/** * scala 中List的使用 * */ object ListUse { def main(args: Array[String]): Unit = { def decorator(l:L ...
- 二分图建图,并查集求联通——二维等价性传递 cf1012B好题!
/* 模拟二分图:每个点作为一条边,连接的是一列和一行(抽象成一个点,列在左,行在右) 由题意得 a-b相连,a-c相连,b-d相连,那么d-c就不用再相连了 等价于把二分图变成联通的需要再加多少边 ...
- iOS开发之SceneKit框架--SCNScene.h
1.SCNScene SCNScene是一个场景图——具有附加几何形状.光照.摄像机和其他属性的节点的层次结构,共同形成可显示的3D场景. 2.相关API简介 初始化方法 //懒加载 + (insta ...