摘要: GitHub地址:https://github.com/qiangzi7723/img2Ascii 如果觉得不错可以给个star或者提出你的建议 img2Ascii,基于JS的图片转ASCII示意图。 效果 转码前图片 转码后图片 构建 npm install 或者 yarn install 之后通 阅读全文
posted @ 2017-07-10 12:34 上啊比卡丘 阅读(2404) 评论(0) 推荐(1) 编辑
摘要: github地址:https://github.com/qiangzi7723/draggable 目前这个库的兼容做到了兼容IE8,所以如果需要兼容IE8的朋友不妨试试。库里面写了很多的注释,对于想看源码的同学是一个很好的选择。如果觉得不错可以到github上点个star,谢谢各位了。 库的思路部 阅读全文
posted @ 2017-05-15 17:00 上啊比卡丘 阅读(2747) 评论(14) 推荐(0) 编辑
摘要: 刨根问底,你知道:hover等4个伪类为什么要按顺序排列吗 引言 这4个伪类大家都不陌生,4个伪类要按照 LvHa 这个爱恨原则来排(外国友人起的记忆方法),不然有些效果会出问题。 但是你们都想过这几个属性为什么要按顺序排吗? 和`:hover` 当鼠标移动到a标签上时,会触发a标签上的 效果,但同 阅读全文
posted @ 2016-06-27 17:58 上啊比卡丘 阅读(11390) 评论(1) 推荐(9) 编辑
摘要: 效果图 基本思路 1. 把图片每个像素点的信息拿出来,最重要的是拿到rgb的值 2. 把每个像素点由rgb转成灰度图像,即0 255 3. 给0 255分级,把每个等级的像素点转换成ascii码,完成 实现 第一步:获取像素信息 经查阅,使用canvas的getImageData方法可完成此要求,如 阅读全文
posted @ 2016-06-12 06:50 上啊比卡丘 阅读(4945) 评论(3) 推荐(1) 编辑
摘要: RAF也即是requestAnimationFrame,之前的动画都是基于setTimeout写的,所以为了性能方面的考虑,开始使用requestAnimationFrame写动画。 阅读全文
posted @ 2016-05-20 23:37 上啊比卡丘 阅读(327) 评论(0) 推荐(0) 编辑
摘要: websocket 根据维基定义 WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端直接向客户端推送数据而不需要客户端进行请求,在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并允许数据进行双向传送。 HTTP协议的 阅读全文
posted @ 2016-09-09 00:39 上啊比卡丘 阅读(268) 评论(0) 推荐(0) 编辑
摘要: 可以通过设置audio的muted以及volume属性达到静音的效果。但是在ios上,这个接口的权限是不开放给javascipt的。 阅读全文
posted @ 2016-09-06 19:01 上啊比卡丘 阅读(145) 评论(0) 推荐(0) 编辑
摘要: 最近找到了实习,公司各方面的待遇都很好,在公司里面负责前端的游戏开发,所以,以后博客这方面估计会偏向于记录平时在公司开发游戏的时候遇到的一些问题。 阅读全文
posted @ 2016-07-16 18:00 上啊比卡丘 阅读(128) 评论(0) 推荐(0) 编辑
摘要: 前言 最近在写一个扩展右键菜单的插件,既然是插件,想着一步到位,把相关的style样式设置都丢进js文件中,直接加载一个js文件便可以使用该插件,所以今天就研究了下js批量的插入样式的方法,即addSheet(),顺便总结下Javascript中修改样式的4类方法 正文 1、通过js动态的创建sty 阅读全文
posted @ 2016-07-13 20:43 上啊比卡丘 阅读(5630) 评论(0) 推荐(0) 编辑
摘要: 今天早上遇到了个小bug,刚好用从css权威指南学到的知识解决了 html结构 Tab 1 Tab 2 Tab 3 css样式 .portlet nav a { color: fff; text decoration: none; display: block; padding: 7px 10px 阅读全文
posted @ 2016-07-12 23:50 上啊比卡丘 阅读(149) 评论(0) 推荐(0) 编辑
摘要: 在写一个修改dialog框的插件,修改样式的时候是参考别人的样式 这张图中,Hello World和OK分别称作上下部分。 写到下部分的OK按钮的代码时,当时的第一想法就是先给OK按钮的外框定高,然后给OK浮动同时设置右边距,这种做法当然不是不可行,但是看了源码觉得源码的实现更加巧妙。 没错,源码是 阅读全文
posted @ 2016-07-11 22:13 上啊比卡丘 阅读(144) 评论(0) 推荐(0) 编辑
摘要: this指向 直接上代码,凑合着看 //该函数用于测试页面上的this对象 function page(){ console.log(this==window) // true 说明页面上绑定的事件的作用域都是window,这样很不好,因为有时候我们是希望我们的this值就是当前的对象而不是wind 阅读全文
posted @ 2016-07-10 16:58 上啊比卡丘 阅读(976) 评论(0) 推荐(0) 编辑
摘要: 效果图 基本思路 1. 把图片每个像素点的信息拿出来,最重要的是拿到rgb的值 2. 把每个像素点由rgb转成灰度图像,即0 255 3. 给0 255分级,把每个等级的像素点转换成ascii码,完成 实现 第一步:获取像素信息 经查阅,使用canvas的getImageData方法可完成此要求,如 阅读全文
posted @ 2016-07-10 16:05 上啊比卡丘 阅读(17868) 评论(2) 推荐(8) 编辑