前期准备

1、打开秀米官网,点击右上角登录(建议微信登录)
https://xiumi.us/#/
2、如果想在秀米排版的能同步到公众号,请授权一下公众号,具体参考以下两篇文章
http://www.coozhi.com/youxishuma/hulianwang/80847.html
https://jingyan.baidu.com/article/cb5d6105de98b4005d2fe05d.html

接下来进行排版公众号

1、进入首页,选择新建一个图文

2、找到svg,点击

3、在svg图中找到你想要的切换动效,如我想点击展示,点击后下面就会出现点击查看更多的很多模板

点击其中一个svg切换效果之后,左边的模板都是对应效果的案例,你可以选择比较符合你要求的按钮,假设第一个比较符合你,你就点一下第一个案例,右边就会有相对应的案例
**
**
点击一下预览,你就可以看到效果了

点击预览之后会弹出一个二维码,扫码就可以查看效果了

接下来就是修改成自己想要的图片以及效果
1、先把自己需要的图片先上传上来,点击一下我的图库,然后上传自己需要的照片

模板会有很多其他的文字内容,可以先把模板不需要的先删除掉

如这部分,然后再预览看一下,点击换图就没问题了,他一开始是空白图片,点击一下变成一张猫的图,接下来我们就要换成我们自己的图片,点一下右边编辑面板猫这张图片,然后再点一下你自己图库中相对应的图片,这边点击就变成你的图片了,可以预览看一下
这时候你会发现你自己的图片可能展示不全!!!!,原因在于你上传的图片跟它原本的图片的尺寸比例不一样,接下来就要修改一开始的空白图片以及展示不全的问题
点击一下布局按钮,打开布局

点击一下布局灰色的边框,出现动画的按钮

点击动画按钮,然后修改为你想要的效果

你按照你的需求进行修改,我的修改如图

接下来再预览一下,点击换图没问题了,但是模板的边框还在,如果你想要的就是这种效果那就不用改了,如果不要修改如下
点击布局按钮,把布局放开(有出现灰色框框的就是已经打开了)

点击右上角灰色框框,出现间距两个字

把间距都调整为你需要的
(把布局三个灰色的框框都依次操作,把所有的间距都调整为你要)

再预览一下看看效果就可以了

备注:需要修改东西的记得先把布局打开,然后在点一下布局灰色的框框,点击左边的出现动效,右边是修改间距、边框等

当有多个这样的点击展示的图片放在一起的时候,有可能会出现缝隙


图片于图片之间的缝隙通过修改组件定位进行修改
打开布局,点击灰色框框,找到组件定位,然后把间距改为前后间距改为0就行了

使用秀米编排点击展示H5相关推荐

  1. 秀米svg点击显示另一张图_秀米说:SVG和图文排版

    公众号图文的交互性,也可以用滑动布局来做,比如这样: 光 阴 的 事 故 A Story of Time 滑动解锁回忆 1 1980-2020 一寸光阴一寸金,寸金难买寸光阴. 2 1980-2020 ...

  2. 秀米svg点击显示另一张图_这个svg也太好玩了吧,居然可以自动展开全文!

    原标题:这个svg也太好玩了吧,居然可以自动展开全文! 胖友们大家好呀,我是三儿 三儿发现,胖友们都比较喜欢自动变换和展开样式的svg.自动变换能够省掉点击步骤,展开svg可以将 隐藏的内容展开,两个 ...

  3. 秀米svg点击显示另一张图_公众号排版怎么做?点击图片出现另一张图片是怎么弄的?...

    怎么在公众号后台排版 过去小编使用第三方编辑器,同步或复制排版好的文章到公众号后台时,总能遇到格式错乱,或者样式复制不过来的问题,不仅操作流程繁琐,还需要花时间去调整文章排版,令人头疼. 后来,小编在 ...

  4. 秀米SVG点击图片换图

    [文章推荐]流动爱心(求点击) 点击[SVG]-[点击换图]-[把SVG放在推文中] 点击右边的方块[布局模式]-[点击最外边的边框]直到出现动画-点击[动画] 点击大图可以更换图片,点击[+]号可以 ...

  5. 秀米的对话框格子可以变大吗_秀米怎么制作微信滑动照片呢?方法/步骤

    秀米怎么制作微信滑动照片呢?方法/步骤 很在微信里面发布图文信息往往涉及排版编辑,而微信文章编辑利器一定就是秀米了,秀米怎么制作滑动照片呢?这个技巧可能掌握的人并不多,一起来看看教程吧! 方法/步骤 ...

  6. android:使用TextView展示H5文本(含关键字点击和图片)

    一.需求描述 使用TextView展示H5文本,文本中包含关键词和图片,在H5文本中只有关键词会标红,在TextView中展示出来的关键词需要加点击事件. 具体如下图: 使用TextView展示H5文 ...

  7. 「教程」秀米怎么添加附件(Word文档、Excel表格等)

    [教程]秀米怎么添加附件(Word文档.Excel表格等) 秀米作为一款微信公众号文章编辑器,因为模板众多,操作方便,很受公众号运营者的喜欢.但是很多运营者不知道怎么通过秀米给公众号文章添加附件,秀米 ...

  8. 秀米怎么添加附件链接,如Word、Excel、Pdf等

    今天公司的运营小妹问我,使用秀米编辑公众号文章时,怎么给推文添加附件链接.因为秀米属于第三方的编辑器,跟公众号原生编辑器还是不一样的,所以添加附件链接的操作也是不一样的.下面详细说一下吧,让大家对公众 ...

  9. 秀米怎么添加pdf附件「教程」

    秀米是一款实用的公众号图文排版工具,它拥有丰富的模板和大量的实用小组件,深受公众号运营者的喜爱,很多公众号运营者都倾向于使用秀米作为公众号推文编辑器的第一选择. 很多公众号运营者在发布图文内容的时候, ...

  10. 秀米的对话框格子可以变大吗_更新丨秀米图文可以一键兼容多格式发布到其他平台了!...

    原标题:更新丨秀米图文可以一键兼容多格式发布到其他平台了! 亲爱的编辑小伙伴们~用了秀米这么长时间,想必大家都不满足只在微信里发布图文,其他平台也要能发布能支持秀米模板的图文.秀米技术小葛格说要满足大 ...

最新文章

  1. C++语言基础(11)-多态
  2. C++ cctype定义的函数 - 学习笔记(7)
  3. JDK15新特性密封类可以被继承了!
  4. html中给div设置的属性怎么样才能拿得到_HTML与CSS结合的三种方式:优先级比较...
  5. 随手笔记:我的架构师之路--沈剑 到家集团技术委员会主席快狗打车CTO
  6. 数学模型:优化模型(一)存贮问题
  7. 你还在用Rational Rose画图吗?来来来给你介绍一款开源免费上手容易的 BOUML UML画图工具。
  8. 使用matlab计算 洛伦兹方程 的李雅普诺夫指数
  9. CefSharp方法汇总
  10. 时间管理表 - 《周计划表》
  11. R中报错ERROR: configuration failed for package ‘magick’
  12. P1713 麦当劳叔叔的难题(90分)
  13. 系统初始化配置资源失败教程
  14. HTML基本网页结构
  15. dede {dede:channel currentstyle 中使用~seotitle~
  16. 一个python+flask和SQLite的数字查找以及Dataload命令生成的小工具
  17. 服务器文件夹temp,服务器性能变慢 c盘temp文件夹存在大量sess开头文件的问题原因及解决...
  18. 内存检测工具:sanitizer
  19. React 高阶组件HOC使用总结
  20. 谷歌开源的跨平台UI开发框架Flutter

热门文章

  1. 基于JESD204B的LMK04826时钟芯片开发笔记
  2. 数字签名与数字加密的区别
  3. 利用canvas画钟表
  4. u盘容量影响计算机运行速度,插u盘导致电脑运行速度慢的解决方法
  5. 11月 第4周 GitChat 话题排行榜
  6. Exif信息 处理图片上传时翻转问题
  7. NPDP产品经理小知识:财务分析与投资回报率
  8. oracle修改dbf文件,如何修改Oracle的dbf文件位置
  9. Python3使用dbf模块读写dbf文件
  10. linux打开笔记本摄像头驱动程序,Linux下使用Opencv打开笔记本摄像头