微信公众号 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)
最近因为业务的需要,老板布置做了两个月简单的的微信公众平台开发,从网上搜了一些资料,实话说资料不多. 在参考学习的过程中也遇到了不少难缠的小问题,虽然不难逾越,但是确实浪费了时间. 我发现网上仅有不多 ...
随机推荐
- java通过传送地址获取坐标
package com.action; import java.io.BufferedReader; import java.io.InputStream; import java.io.InputS ...
- [MtOI2019]幽灵乐团
题目 一个很暴力的辣鸡做法 考虑到两个数的\(\gcd\)是所有质数次幂取\(\min\),两个数的\(\rm lcm\)是所有质数次幂取\(\max\),于是最后的答案一定是\(\prod p_i^ ...
- iphone11系统输入框的光标位置不正常
本人的系统是11.3的是正常的,却发现测试机的11.1和11.2的光标位置在输入框的下边.百度一下,很多人有同样的问题,在此记录一下 解决办法一: //弹框弹出后执行如下代码 $('body').cs ...
- 鼠标悬浮到div上,div进行360°旋转
<!DOCTYPE html> <html> <head> <title>旋转</title> </head> <styl ...
- iOS开发系列-Charles
概述 Charles相当于一个插在服务器和客户端之间的"过滤器".当客户端向服务器发起请求的时候,先到charles进行过滤,然后charles在把最终的数据发送给服务器: 注意: ...
- ubuntu安装更新命令
ubuntu16.04LTS 进入ubuntu系统后,打开一个终端,如图所示.此时以普通用户身份登录. 由于更新系统需要用到管理员权限,因此要么使用"su -"直接切换到roo ...
- 2018-8-10-win10-uwp-如何让一个集合按照需要的顺序进行排序
title author date CreateTime categories win10 uwp 如何让一个集合按照需要的顺序进行排序 lindexi 2018-08-10 19:16:50 +08 ...
- 查看收到的邮件的来源ip以及包信息
有时我们需要知道收到的邮件是从哪台服务器发送过来的,或者想知道该邮件的报文头是怎样的.以下以网易邮箱为例介绍如果抓取这些信息. 首先我们需要知道网易邮箱的访问服务器(拉协议),由于SMTP是推的协议, ...
- arc098E Range Minimum Queries
题意:给你一个n个数的数组,每次能够选取连续的长度为K的子序列,取出其中任意一个最小元素. 一共操作Q次.问取出的元素中Max-Min最小是多少? 标程: #include<bits/stdc+ ...
- CommonsMultipartResolver 文件上传
依赖 <dependency> <groupId>commons-fileupload</groupId> <artifactId>commons-fi ...