2019年02月_wangshang1320

原创 css float和absolute脱离文档流的问题

CSS中的布局默认是从上到下（块元素），从左到右（行内元素），有时候就需要左右排列float让元素浮动，以前用的比较多，在css3没出来之前这个挺好用的。让当前元素浮动，实现左右布局，部分脱离文档流，父元素高度塌陷等，给元素设置了float属性后其紧随其后的块元素会无视设置float属性的元素，但是后面元素的文本依然会为float元素让出位置，环绕于周围float：letf|right...

2019-02-28 13:54:29 1745

原创 js获取圆上的点

最近在写动画效果，需要获取圆上的点就简单的回顾了一下数学知识这里圆点0 为圆心，我们需要知道A点的（x,y）坐标，因为这个点就是在圆点上，而r就是半径，通过三角函数可得出：cos(A) = c/b; sin(A) = c/a；转换到坐标系中就是：sin(o) = r /...

2019-02-27 15:26:32 3619

转载关于贝塞尔曲线

众所周知，做动画用的比较多的就是贝塞尔曲线，贝塞尔曲线能够平滑的绘制动画，让计算机比较僵硬的直线变得视觉效果更好。贝塞尔曲线：它是依据四个位置任意的点坐标绘制出的一条光滑曲线。而贝塞尔追踪方程则是以点运动的形式描述了贝塞尔曲线的形成过程，将曲线描述为了一条随连续时间而形成的点迹。贝塞尔曲线一阶方程，一阶方程指得是只有两个点我们将迹点运动的总时间记为1，并把这两个端点分别记作 P0...

2019-02-21 11:12:33 637

原创 js中几种循环方式和性能分析

1.普通for循环for (let i = 0; i < arr.length; i++) { let obj = arr[i]; }优化：for (let i = 0,len = arr.length-1; i < len; i++) { let obj = arr[i];}2.foreach 数组方法arr.forEach(f...

2019-02-20 10:06:21 1431

原创响应式网站布局（三）

本文说一下百分比和rem，em等自适应单位来实现响应式布局吧1.百分比布局针对响应式网站，可能百分比是最直观也是最简单的，给父亲设置固定宽高，子元素用百分比设置比较直观的就是bootstrap框架就是典型的百分比布局2.px,rem，em， vw，vhvw:设备可视宽度默认为100vwvh:设备可视高度默认为100vhpx:1px=1像素rem：参照物为...

2019-02-20 09:35:43 194

原创 canvas学习案例之贪吃蛇

最近在看canvas画板，就自己尝试写一个简单的小例子贪吃蛇涉及到的点有：碰撞检测，数组操作，canvas图形绘制，定时器，es6的类的使用废话不多说直接上代码吧：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title&amp

2019-02-19 16:26:05 299

原创响应式网站布局（二）之flex布局

flex弹性布局概述： flex布局是css3中用的比较多的比较实用，很多场景都能用到，而且比较简单，方便。　　使用flex布局的容器（flex container），它内部的元素自动成为flex项目（flex item）。容器拥有两根隐形的轴，水平的主轴（main axis），和竖直的交叉轴。主轴开始的位置，即主轴与右边框的交点，称为main start；主轴结束的位置称为mai...

2019-02-18 10:30:34 302

原创响应式网站布局（一）之媒体查询

媒体查询 @media1. 设置 Meta 标签（适用于移动端）大多数移动浏览器将HTML页面放大为宽的视图（viewport）以符合屏幕分辨率。你可以使用视图的meta标签来进行重置。下面的视图标签告诉浏览器，使用设备的宽度作为视图宽度并禁止初始的缩放。在<head>标签里加入这个meta标签。<meta name="viewport" content="widt...

2019-02-18 10:02:04 254

转载前端构建化工具gulp的使用

原文地址：https://www.cnblogs.com/2050/p/4198792.html?tdsourcetag=s_pcqq_aiomsg

2019-02-13 14:36:55 75

原创 JavaScript引用传递问题（深拷贝，浅拷贝）

基本数据类型都是值传递不会存在引用问题，数组和对象会存在问题（例：某个地方某个对象的属性改变后，之前使用这个对象的地方的这个值会改变），有时候就会莫名其妙的不知道怎么值变啦（针对没遇到过这种问题的，遇到过的后面写就尽量避免，怎么避免？那就用深拷贝咯），这里就需要用深拷贝啦，可以理解成新开一个地址来存储这个对象。jQuery: jQuery.extend() 函数用于将一个或多个对象的...

2019-02-12 10:41:28 537

转载 JavaScript性能优化

最初的 JavaScript 是一种解释型的语言，所以在执行速度上比编译型语言慢得多。后面有了 Chrome，它内置了优化引擎，把 JavaScript 编译为本地代码再执行，很多浏览器纷纷效仿，所以现在的 JavaScript 已经是编译型的语言咯O(∩_∩)O~1 注意作用域1.1 for 循环中的全局变量使用全局变量或函数的查找开销比局部变量或函数大得多，因为这会涉及到作用域链上的查...

2019-02-11 15:23:50 232

wangshang1320的博客