适用人群

公众号运营小编、平面设计师、前端开发工程师、后端开发工程师、客户经理（试看课程，确认是否适合自己）

课程概述

1、本课程按照知识逻辑进行设计，贴合项目实战开发讲解（从易到难）；
2、本课程会提供相关的课程案例代码（电脑端可以下载资料）；
3、本课程目录会随着行业变化进行动态调整（最终以页面前端展示为准）；
4、本课程内容不定期更新，如有特殊情况会延迟更新（最终以页面前端展示为准）；
5、【iOS用户推荐网页端买课，简单方便，这样操作就不需要额外充值啦，也能为作者节省下30%的iOS渠道费，感谢支持~】

温馨提示：
1、本课程为虚拟服务，已购买内容不支持退款，敬请谅解；
2、本课程内容更新无需再次付费，打开课程即可观看新内容；
3、购买后除不可抗力因素外，本课程长期有效；
4、本课程是编写SVG代码完成公众号黑科技排版，而不是使用第三方排版工具。另外，使用SVG代码开发排版更灵活；
5、购买本课程后，在网易云课堂客服入口开具发票。

目录

章节1:公众号SVG黑科技互动排版 – 制作工具试看
课时1视频公众号SVG排版快速制作开发工具（仅做了解，推荐下面两款工具）16:16
课时2视频公众号SVG排版快速制作开发工具（VS Code，Win|Mac推荐使用）08:49
课时3视频快速添加自定义代码片段，提高SVG开发效率（VS Code）06:17可试看
课时4视频公众号SVG排版快速制作开发工具（HBuilderX）05:13
课时5视频快速添加自定义代码片段，提高SVG开发效率（HBuilderX）04:34
课时6视频使用设计软件快速切图与测量图片数据07:47
课时7视频图片素材在线压缩工具（提升图文加载速度）03:41
课时8视频使用Chrome谷歌浏览器预览与调试SVG图文排版09:24
课时9视频公众号图文一键导入SVG排版代码04:44
章节2:公众号SVG黑科技互动排版 – 基础知识
课时10视频CSS盒模型属性与常用单位11:54
课时11视频CSS背景属性设置元素的背景图以及大小12:19
课时12视频CSS3变形属性的2D基础应用09:02
课时13视频SVG元素在公众号排版的应用07:36
课时14视频使用foreignObject元素实现灵活嵌套05:41
章节3:公众号SVG黑科技互动排版 – 实战开发试看
课时15视频四种方法实现无缝长图排版19:08
课时16视频优化解决无缝长图的缝隙问题07:48
课时17视频适配深色模式的无缝长图（点击可弹出图片、长按可识别二维码）14:17
课时18视频深色模式的彩蛋（Tips：公众号已经不支持）07:44
课时19视频使用懂点君浏览器插件快速获取图片地址和代码（课程学员专用）04:26
课时20视频点击瞬间下拉展开无缝长图（宽度固定）13:39
课时21视频点击瞬间下拉展开无缝长图（宽度自适应）12:47
课时22视频SVG的贝塞尔曲线动画（SVG动画）10:48
课时23视频点击慢慢下拉展开无缝长图（宽度固定）06:41
课时24视频点击慢慢下拉展开无缝长图（宽度自适应）08:52
课时25视频多段自动下拉展开无缝长图（刷屏全网案例“红了！”）08:33
课时26视频两种方法实现点击瞬间切换图片（图A变图B）11:10
课时27视频两种方法实现点击动画切换图片（图A变图B）11:14
课时28视频长按图A淡出，显示图B，松开手指不恢复原样（图A变图B）08:53
课时29视频长按图A淡出，显示图B，松开手指图A又淡入（图A变图B）10:25
课时30视频点击图片从模糊（毛玻璃）逐渐变清晰09:09
课时31视频点击首图淡出下拉展开无缝长图（互动伸长）13:54
课时32视频点击缩回到顶再下拉展开无缝长图08:58
课时33视频点击播放动图GIF（使用位移的方式实现）13:05
课时34视频序列帧模拟播放动图GIF 11:04
课时35视频使用工具快速生成序列帧模拟动图GIF（懂点君为课程开发的工具）04:51
课时36视频长按播放动图GIF序列帧，松手回到初始状态11:31
课时37视频点击播放动图GIF下拉展开无缝长图（互动伸长）06:30
课时38视频点击播放自定义音频/QQ音乐（Tips：这个方法公众号已经不支持）14:46
课时39视频点击播放音频（音频海报）09:32可试看
课时40视频点击播放伪音频（使用视频实现音频播放）06:45
课时41视频点击同时播放音频与动图GIF（防止滑动误触）11:13
课时42视频点击同时播放伪音频与动图GIF（使用视频实现音频播放）10:45
课时43视频点击同时播放音频与动图GIF，再下拉展开无缝长图（互动伸长）13:28
课时44视频可重复不限次数点击展开与点击缩回（点击伸长与点击收缩）18:54
课时45视频可重复不限次数点击显示图片和关闭图片（点击显示与点击关闭）12:59
课时46视频快速去除色彩全文黑白灰色显示03:26可试看
课时47视频视频号美化跳转（美化视频号封面）07:04
课时48视频公众号美化跳转（美化公众号卡片）06:01
课时49视频小程序美化跳转（美化小程序卡片，无弹窗提示）07:54
课时50视频添加超链接与小程序链接（不带角标）06:52
课时51视频多个点击展开向下平铺拉开 （平铺伸长）04:53
课时52视频点击展开套多个点击展开（伸长套多个伸长）06:38
课时53视频根据选项展开不同的长图（选择伸长）13:48
课时54视频多次点击连续展开长图（多段伸长）13:52
课时55视频逆向掉落下拉展开长图（逆向伸长）05:27
课时56视频多次连续点击切换图片下拉展开长图（互动伸长）06:21
课时57视频多次连续点击撕纸翻页下拉展开长图（互动伸长）10:54
课时58视频扑克卡片连续飞出下拉展开长图（互动伸长）16:39
课时59视频长按填色解锁下拉展开长图（互动伸长）19:23
课时60视频密码解锁下拉展开长图（互动伸长）18:47
课时61视频左右横向滑动多张图片（适配深色模式）08:16可试看
课时62视频上下纵向滑动多张图片（适配深色模式）07:15
课时63视频左右横向吸附滑动图片和上下纵向吸附滑动图片（自动对齐）06:09
课时64视频左右横向滑动图片和上下纵向滑动图片黑白变彩色（切换颜色）07:28
课时65视频点击左滑解锁左右滑动图片（解锁滑动）09:43
课时66视频层层左右交错滑开与弹出海报（多层滑动）09:31
课时67视频纵向错层滑动（顶层和底层滑动，中间层不滑动）08:02
课时68视频纵向顶层滑动填色（填色互动）05:07
课时69视频全屏滑动追光灯点击下拉展开（互动伸长）11:52
课时70视频全屏单页纵向滚屏动画（模拟H5活动页）16:53
课时71视频无缝滚动轮播图片（多图展示）06:48
课时72视频无缝间隔停顿滚动轮播图片（多图展示）05:46
课时73视频多次连续点击镜头放大再下拉展开（场景切换&互动伸长）14:09
课时74视频打印机动态打印海报，海报长按可保存（模拟互动）08:07
课时75视频多个标签左右互斥抽拉（自动返回）09:56
课时76视频横向左右视差滑动（自动对齐）14:45
课时77视频纵向上下视差滑动（自动对齐）06:49
课时78视频汽车轨迹运动与下拉伸长（路径动画）
声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。