saber 酱的抱枕

Fly me to the moon

09/19
2018
学习

JavaScript 转换 CSS 里的长度单位

CSS 的常用长度单位有 px、em、rem、pt 等。今天我遇到一个情况,有两个网站都使用了 rem 作为单位,但是根元素(html)的字号并不相同,需要进行转换。

移植页面的根元素字号是 20px,CSS 规则如:
height: 4rem;

我的根元素字号是 100px,需要除以 5,改成:
height: 0.8rem;

因为需要修改的地方很多,所以我写了个正则来处理。本文的代码并不是一个通用的工具,只是提供了解决思路。

这次的情况是同一种单位之间的转换,有时候我们可能需要进行不同单位之间的转换,思路都是一样的,根据需要修改代码即可。
Read More →

JavaScript 转换 CSS 里的长度单位

08/27
2018
学习

JavaScript 判断数字是否是质数

JavaScript 判断数字是否是质数

看到了一个 JavaScript 面试题,编写一个函数 isPrime,检查输入的参数是否是质数。

质数又称素数,定义为在大于1的自然数中,除了 1 和它本身以外不再有其他因数。也就是只能被 1 和它自身整除。

质数列表如: 2 3 5 7 11 13 17 19 23 ……

要点:
1.质数只能是正整数,所以负数、0、小数都不是质数。
2.质数是从 2 开始的,2 比较特殊,是质数里唯一一个偶数。对 2 要单独处理。
3.大于 2 的偶数都不是质数,因为可以被 2 整除。所以我们可以直接排除偶数,提高效率。
4.把奇数开平方,让奇数依次除以 3、5、7……一直到它的平方根,看有没有能整除的,如果有那就不是质数。
Read More →

JavaScript 判断数字是否是质数

08/4
2018
学习 软件

把 zip 压缩包转换为 gif 动图

把 zip 压缩包转换为 gif 动图

最近我打算给 Pixiv 图片下载器添加下载 gif 图的功能,今天折腾出了这个 demo。

查看 demo 下载测试用的 zip 文件

Pixiv 的动态图并不是 gif 格式,而是一个 zip 压缩包,里面包含了很多张图片。把这些图片按顺序显示,看起来就像是动图一样。

很多人给我说过想要下载 gif 图,这个 demo 就可以把 zip 压缩包转换成 gif 动图。大家如果有以前在 Pixiv 下载的压缩包,也可以直接在这个 demo 里转换,转换之后右键保存即可。
Read More →

把 zip 压缩包转换为 gif 动图

06/16
2018
学习

用 Vue.js 给本站做了个皮肤(大概)

近来在学习 Vue.js,基础知识学的差不多了之后,想要做个项目融会贯通一下。这几天写了个博客前端,可以算是本站的一个皮肤(虽然丑)。这也是一个前后端分离的单页面应用。

在线访问:

saber 酱的抱枕 2 号

数据和图片资源都是直接用的本站的。数据由 WordPress REST API 提供,不用自己写 API 接口了。

通过这个项目,进一步熟悉了 Vue.js 和它的相关插件,也学了学 muse-ui 和 Less 的使用,收获不小。

github 地址:

https://github.com/xuejianxianzun/vue-myblog-xjxz

好歹算是个展示吧,不指望有人用(用也用不好,因为我图片开了防盗链)。如果有人要用这个改一改,给 WordPress 后台的网站做个前台倒可以,毕竟后台的 API 一致,用起来方便。

效果预览:
Read More →

用 Vue.js 给本站做了个皮肤(大概)

06/15
2018
软件

恶作剧的 carnival.js

carnival.js

carnival.js 可以让网页不停地抖动,作者可真是个小机灵鬼。

在网站头部引用carnival.js:

<script src="https://nd002723.github.io/carnival/js/carnival.js"></script>

或者将下面代码保存为书签,动态引入:

javascript:void(function(){var d = document,a = 'setAttribute',s = d.createElement('script');s[a]('tyle','text/javascript');s[a]('src','https://nd002723.github.io/carnival/js/carnival.js');d.head.appendChild(s);})();

网站示例 (在这个页面点击书签部分的代码,稍等一会儿就能看到效果。)

源码下载(zip)

本文由网友投稿

恶作剧的 carnival.js

05/21
2018
学习 软件

Vue.js 制作的待办事项 todolist

Vue.js 制作的待办事项 todolist

前些时候学习 Vue.js,做了个 todolist(待办事项),可以把自己要做的事情写上去做个备忘。大致效果如上。

这是一个简单的单页应用,你可以直接在线使用

Github 地址

功能介绍:

您可以自由的添加、删除事项;切换完成状态;重命名;视需要设置定时提醒。
默认没有背景图片,因为用户可以自己设置背景图。(右下角设置区域)
默认有一个提醒铃声,用户也可以自行更改。
本页面会保存工作状态,关闭页面也不会丢失数据。 重新打开页面就可以继续使用了。
所有数据存储在用户本地,不收集用户信息。(话说我哪来的用户啊)
其他详见使用说明。(右下角设置区域)
Read More →

Vue.js 制作的待办事项 todolist