click 点击图片不起作用_在公众号添加"点击显示答案效果"

论坛 期权论坛 编程之家     
选择匿名的用户   2021-6-2 18:00   1368   0

作为一个即将秃头的程序员,这么实用的功能这么能不去研究一下呢?

进入正题 ???

1.打开微信公众号,新建图文。

①右键 → 检查

②鼠标点击右边的代码区域,按Crtl+F,随便输入点图文内容,能够找到代码位置就行。

2.插入代码。

①随便找个标签,右键点击Edit as HTML

②在编辑框中加入如下代码......

<section style="height: 230px;overflow-x: hidden;overflow-y: auto;text-align: center;box-sizing: border-box;padding: 10px;border-width: 1px;border-style: solid;border-color: rgb(238, 238, 238);">  <mpchecktext contenteditable="false" id="1603559997900_0.2463386146901354">mpchecktext>  <section style="border-width: 0px;border-style: none;border-color: initial;box-sizing: border-box;">    <mpchecktext contenteditable="false" id="1603559997901_0.7806160681602305">mpchecktext>    <p style="text-align:center;margin-bottom: 10px;white-space: normal;">            <strong style="font-size: 14px;caret-color: red;">        <span style="font-size: 14px;">          <span style="line-height: 22.4px;">                        <p>答案p>            <img border="0" src="https://picsum.photos/100/50">            <mpchecktext contenteditable="false" id="1603559997902_0.2770796707640486">mpchecktext>          span>        span>      strong>    p>    <strong style="font-size: 14px;caret-color: red;">      <mpchecktext contenteditable="false" id="1603559997903_0.5044436455277546">mpchecktext>    strong>  section><strong style="font-size: 14px;caret-color: red;">strong>section><center style="box-sizing: border-box;text-align: center;">  <strong style="font-size: 14px;caret-color: red;">        <svg width="100%" height="250" xmlns="http://www.w3.org/2000/svg" style="margin-top: -350px;box-sizing: border-box;transform: rotateZ(0deg);-webkit-transform: rotateZ(0deg);-moz-transform: rotateZ(0deg);-o-transform: rotateZ(0deg);">      <rect width="100%" height="250" style="fill: #fefefe;box-sizing: border-box;">        <animate attributeName="opacity" begin="click" dur="1s" style="box-sizing: border-box;" from="1" to="0" fill="freeze">animate>      rect>      <mpchecktext contenteditable="false" id="1603559997904_0.23689150596511355">mpchecktext>    svg>  strong>center>

emmmm.....代码有点小长,里面怎么设置有说明~

3.关于图片

想要使用图片必须使用已经上传到素材库的图片。

获取方式:去素材库中找到需要的图片,右键检查,找到对应的url复制下来,再粘贴到上述代码中的就行了~

4.实现效果

点击空白处查看答案

dd7778c1ca4d13d46d91533a4879e02f.png


CSDN有更详细的介绍~点击原文跳转

分享到 :
0 人收藏
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

积分:3875789
帖子:775174
精华:0
期权论坛 期权论坛
发布
内容

下载期权论坛手机APP