介绍

发现一款开源的动画简历工程, 很是吸引眼球, 分享出来。

技术:

1、 npm工程管理

2、 vuejs

设计上,将工程分为两个组件:

0、程序入口组件

1、 编辑器组件

2、 简历展示组件

流程上:

0、 程序入口组件,引入另外两个组件

1、 程序入口组件, 将样式 和  样式内容 每隔1ms填入 编辑器组件, 编辑器组件不仅仅显示样式内容, 并将样式生效。

每隔1ms一段时间,实现了动态效果。

2、 开始显示简历, 将简历内容(markdown)填入 简历组件,

3、 然后将简历的样式,填入编辑器组件, 将简历组件的样式生效, 这个过程也是一个每隔1ms的填入一部分的样式的动态过程, 结果为动画形式。

工程文件:

https://github.com/fanqingsong/aboutme/

效果

访问如下链接

https://fanqingsong.github.io/aboutme/

a dynamic resume的更多相关文章

  1. Oracle Dynamic Performance Views Version 12.2.0.1

    Oracle Dynamic Performance ViewsVersion 12.2.0.1 https://www.morganslibrary.org/reference/dyn_perf_v ...

  2. debian下使用dynamic printk分析usb网卡驱动

    在<debian下使用dynamic printk分析usb转串口驱动执行流程>中使用了usb转串口,当前例子使用usb网卡分析驱动(dm9601芯片). 仍然需要使能dynamic pr ...

  3. debian下使用dynamic printk分析usb转串口驱动执行流程

    看了一篇文章<debug by printing>,文中提到了多种通过printk来调试驱动的方法,其中最有用的就是"Dynamic debugging". “Dyna ...

  4. var和dynamic的区别

    1.var 1.均是声明动态类型的变量. 2.在编译阶段已经确定类型,在初始化的时候必须提供初始化的值. 3.无法作为方法参数类型,也无法作为返回值类型. 2.dynamic 1.均是声明动态类型的变 ...

  5. 遍历dynamic的方式

    一.遍历ExpandoObject /// <summary> /// 遍历ExpandoObject /// </summary> [TestMethod] public v ...

  6. C# dynamic 动态创建 json

    1. 如何通过C# 的dynamic 创建如下json 对象? { "query": { "match": [{ "name": " ...

  7. BZOJ 1901: Zju2112 Dynamic Rankings[带修改的主席树]【学习笔记】

    1901: Zju2112 Dynamic Rankings Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 7143  Solved: 2968[Su ...

  8. 当类型为dynamic的视图模型遭遇匿名对象

    当年在ASP.NET MVC 1.0时代我提到,在开发时最好将视图的Model定制为强类型的,这样可以充分利用静态检查功能进行排错.不过有人指出,这么做虽然易于静态检查,但是定义强类型的Model类型 ...

  9. 动态规划 Dynamic Programming

    March 26, 2013 作者:Hawstein 出处:http://hawstein.com/posts/dp-novice-to-advanced.html 声明:本文采用以下协议进行授权: ...

随机推荐

  1. jmeter中如何引用Java

    通过source()获取java文件: vars.get,获取参数type_id的值

  2. 斐波那契数性质 gcd(F[n],F[m])=F[gcd(n,m)]

    引理1 结论: \[F(n)=F(m)F(n-m+1)+F(m-1)F(n-m)\] 推导: \[ \begin{aligned} F(n) &= F(n-1)+F(n-2) \\ & ...

  3. 项目Beta冲刺(7/7)(追光的人)(2019.5.29)

    所属课程 软件工程1916 作业要求 Beta冲刺博客汇总 团队名称 追光的人 作业目标 描述Beta冲刺每日的scrum和PM报告两部分 队员学号 队员博客 221600219 小墨 https:/ ...

  4. Ofbiz项目学习——阶段性小结——更新数据

    一.根据一个字段进行修改 /** * 根据一个字段进行修改(这个条件字段可以是主键, 也可以不是主键) * @param dctx * @param context * @return */ publ ...

  5. jmeter+ant+jenkins搭建接口自动化测试环境(基于win)

    1.jmeter jmeter依赖java运行环境,所以需要提前下载jdk并配置好环境变量 官网下载(http://jmeter.apache.org/download_jmeter.cgi),我用的 ...

  6. 开发(三)ESP32 硬件配置

    https://github.com/espressif/arduino-esp32

  7. 文件夹上传组件webupload插件

    javaweb上传文件 上传文件的jsp中的部分 上传文件同样可以使用form表单向后端发请求,也可以使用 ajax向后端发请求 1.通过form表单向后端发送请求 <form id=" ...

  8. 苹果MAC OS查看MAC地址及修改ip

    一,查看mac地址 第一步: 第二步: 第三步: 二,更改IP 第一步: 第二步: 第三步: 最后点击“好”就完成了 我要这天再遮不住我眼,要这地再埋不了我心.要这天下众生都明白我意,要那诸佛都烟消云 ...

  9. Linux(Contos7)下使用SSH远程安装MySQL 8.0.17 完整笔记

    1. 使用putty 配置远程服务器连接,登录服务器. 由于没有指定下载包 使用 yum install mysql-server  提示 未指定包,如: 2. 因为甲骨文的收购了Mysql并且对My ...

  10. linux 去掉 ^M 的方法

    在linux上经常遇到这种问题,从网上下载文件到 linux 上后,就多了很多 ^M这种东西,如何集体删除这种东西呢! 用 vim 打开文件 进行如下设置  将文件格式转化为unix :set ff= ...