2018年04月_Albert_Tiger

原创原生js实现双向数据绑定

js实现双向数据绑定<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0&quo

2018-04-27 17:33:49 512

转载 css模拟行星

<html><head> <style> .solarsys{ width: 800px; height: 800px;; position: relative; margin: 0 auto; backgroun...

2018-04-20 14:31:33 221

转载模拟手机滑动

<!doctype html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,minimum-scale=1,user-s

2018-04-20 14:29:34 591

原创 stream学习二

var stream = require('stream')var util = require('util')function ReadStream() { stream.Readable.call(this)}util.inherits(ReadStream,stream.Readable)ReadStream.prototype._read = function () ...

2018-04-19 16:51:29 146

原创 stream学习

来源慕课网var Readable = require('stream').Readablevar Writable = require('stream').Writablevar readStream = new Readable()var writStream = new Writable()readStream.push('I')readStream.push('L...

2018-04-19 16:41:14 163

原创 node之文件拷贝

var fs = require('fs')var readStream = fs.createReadStream('qd1.mp4')var writeStream = fs.createWriteStream('1-qd1.mp4')readStream.on('data',function (chunk) { if(writeStream.write(chunk) === ...

2018-04-19 15:55:40 352

原创 stream

var fs = require('fs')var readStream = fs.createReadStream('logo.png')var n = 0readStream .on('data',function (chunk) { n++ console.log('data emit') console.log(Buffer....

2018-04-19 15:46:29 144

原创 node之buffer模块

来自慕课网let fs = require('fs')fs.readFile('logo.png',function (err, origin_buffer) { console.log(Buffer.isBuffer(origin_buffer)) fs.writeFile('logo_buffer.png',origin_buffer,function (er...

2018-04-19 15:31:24 117

原创 nodejs-promise实现深度爬虫

代码来源慕课网const http = require('http');const cheerio = require('cheerio');const Promise = require('bluebird')let url = 'http://www.imooc.com/learn/348'let baseUrl = 'http://www.imooc.com/learn/...

2018-04-19 11:47:39 756 3

原创 promise应用一

<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-

2018-04-19 11:10:29 103

原创 node.js之评论灌水

内容来源慕课网let http = require('https')let querystring = require('querystring')let postData = querystring.stringify({ commentid:'', content: '写的可以啊', replyId:'' })let ...

2018-04-18 16:31:08 456

原创 node.js之爬虫实现

数据引用慕课网const http = require('http');const cheerio = require('cheerio');let url = 'http://www.imooc.com/learn/348'function filterChapters(html) { let $ = cheerio.load(html) let chapt...

2018-04-18 16:29:54 172

原创闭包创建n!

2018-04-17 17:07:00 208

原创 two.js画地球自转

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> svg,canvas{ backgro

2018-04-13 14:33:10 716

原创 canvas学习小结

5.H5新特性——Canvas绘图技术 Canvas：画布，是H5提供的2D绘图技术。您的浏览器不支持Canvas标签！ CANVAS标签在浏览器中默认是300*150的inline-block。画布的宽和高只能使用HTML/JS属性来赋值，不能使用CSS样式赋值！每个画布上有且只有一个“画笔”对象——称为“绘图上下文”对象——使用该...

2018-04-13 12:52:03 425 1

原创 canvas位置判断

效果图功能点1.百分比字幕在屏幕中间2.百分比和圆环动态展示，互相关联3.鼠标移入圆环时，图标变成手；移出恢复4.鼠标移入圆环是点击，百分比暂停&开始动态切换5.鼠标在圆环外无点击效果6.鼠标在canvas内时动态显示位置不足：鼠标点击控制圆环播放时，第一帧总是从头开始绘制，有闪烁的效果。代码如下：<!doctype html&g...

2018-04-13 11:51:16 2046

原创 border-image使用

效果图开发时遇到要给内容新增一个图片边框，本来是可以用background的，但为了充分利用减少图片的大小，就采用了border-image的特性。 border-image可能小伙伴们用的比较少，下面我来讲讲他的一些特性。属性：1.border-image-source:url(”) 图片的路径 2. border-image-slice 图片的裁切方式，...

2018-04-11 18:21:18 2763

原创优秀网站2

react-router https://lishaoy.net/ 闹钟 webstrom激活 vchart 3d特效魔方 video.js https://www.cnblogs.com/saysmy/p/6429835.html h5视频 https://blog.csdn.net/happylee6688/article/details/34436011 https:...

2018-04-09 18:41:40 126

原创优秀网站

8个前沿的 HTML5 & CSS3 效果 Web 开发中很实用的10个效果 https://www.createjs.com/ jquery插件滚动插件视频播放 https://www.cnblogs.com/huliang56/p/6257120.html http://www.jq22.com/jquery-info3353 视频进度条 ...

2018-04-09 16:52:34 308

转载数值加逗号

toThousands(23456.89) // '23,456.89'方法一循环使用 slice(-3)获取每组数字。function toThousands(number) { var arr = String(number).split('.'); var num = arr[0], result = ''; while (num.length > 3) { ...

2018-04-08 17:15:44 301

原创原生js轮播图

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> * { margin: 0;

2018-04-05 13:09:27 162

原创 Canvas绘图--放缩

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> body{ text-align: c

2018-04-05 13:06:26 214

原创 css 实现3d旋转