介绍

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

技术：

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. 项目Beta冲刺--5/7

    项目Beta冲刺--5/7 作业要求 这个作业属于哪个课程 软件工程1916-W(福州大学) 这个作业要求在哪里 项目Beta冲刺 团队名称 基于云的胜利冲锋队 项目名称 云评:高校学生成绩综合评估及 ...

  2. flutter 项目中，开发环境、多接口域名、多分支的配置

    flutter 项目中,开发环境.多接口域名.多分支的配置 开发环境:配置成多个入口文件.比如:main.dart.main_develop.dart.main_preview.dart 多域名:每个 ...

  3. 15、Python面向对象基础

    和其它编程语言相比,Python 在尽可能不增加新的语法和语义的情况下加入了类机制. Python中的类提供了面向对象编程的所有基本功能:类的继承机制允许多个基类,派生类可以覆盖基类中的任何方法,方法 ...

  4. MongoDB shell 4 用户管理方法

    方法名 描述 db.getUsers()   db.dropAllUsers()   db.updateUser()   db.createUser()   db.revokeRolesFromUse ...

  5. kafk设计要点

    kafka的设计目标是高吞吐量,所以kafka自己设计了一套高性能但是不通用的协议,他是仿照AMQP( Advanced Message Queuing Protocol   高级消息队列协议)设计的 ...

  6. Nginx+Php-fpm运行原理 代理与反向代理

    一.代理与反向代理 现实生活中的例子 1.正向代理:访问google.com 如上图,因为google被墙,我们需要vpnFQ才能访问google.com.Virtual Private Networ ...

  7. A1016 | 磨人的大模拟

    这题写得头晕……明天我再评价 #include <stdio.h> #include <memory.h> #include <math.h> #include & ...

  8. 高考数学答卷策略[K12论坛转载]

    一．试卷上给你的启发 1.试卷上有参考公式,80%是有用的,它为你的解题指引了方向: 2.解答题的各小问之间有一种阶梯关系,通常后面的问要使用前问的结论.如果前问是证明,即使不会证明结论,该结论在后问 ...

  9. kernel 获取ntoskrnl.exe基址

    标题: kernel shellcode之寻找ntoskrnl.exe基址 http://scz.617.cn:8/windows/201704171416.txt 以64-bits为例,这是Eter ...

  10. MSSQL随机修改时间

    GO DECLARE @BDate datetime, @EDate datetime SET @BDate = '20190801' --上限 SET @EDate = '20190819 23:5 ...