自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

Jinmy的博客

每天记录一点滴

  • 博客(155)
  • 收藏
  • 关注

原创 配色网站收藏

1.阿里团队的设计anthttps://ant.design/docs/spec/colors-cn2.谷歌团队 materialhttps://material.io/resources/color/3.colordrop这里面预设了很多的色板组合,颜色的搭配都恰到好处!https://colordrop.io/4.flatuicolors里面的颜色都很高级https://flatuicolors.com/5. webgradients 180个渐变预设组合h...

2020-07-09 16:59:09 473

原创 前端插件收藏

1.Swiper是纯javascript打造的滑动特效插件,面向手机、平板电脑等移动终端。https://www.swiper.com.cn/2.WOW.js – 让页面滚动更有趣https://www.delac.io/wow/3.animate.css 动画库https://animate.style/4.hover.csshttp://ianlunn.github.io/Hover/5.Magic.css一款独特的CSS3动画特效包http://www.jq22..

2020-07-06 13:10:36 147

原创 svg动态科技元素

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>科技.

2020-08-17 16:02:27 784

原创 AE PR 3D动画 相关插件网站

1.lookaeAE PR插件资源https://www.lookae.com/2.gfxcampAE PR 3D动画软件插件资源http://www.gfxcamp.com/3.c4dc4d资源https://www.c4d.cn/

2020-07-24 17:44:13 1738

原创 css3 好看的按钮动态颜色变化效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>An.

2020-07-24 16:29:03 1061

原创 Css3 button hover effect

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Bu.

2020-07-24 15:50:59 250

原创 svg成功失败图标动画

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>sv.

2020-07-21 17:25:33 937

原创 svg stroke按钮路径动画效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>An.

2020-07-21 16:24:32 322

原创 css3 一个button hover 效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Bu.

2020-07-21 11:20:31 3019

原创 anime插件 酷炫效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do.

2020-07-21 10:33:57 699

原创 收藏的一些前端酷炫网站

1.Species-in-pieces30种濒危动物在线演示纯CSS技术表现出30种动物的碎片拼图形象http://species-in-pieces.com/2.codepen.io提供多种效果的网站前端代码设计工具,丰富的案例特效,学习canvas,svg可以来这里https://codepen.io/3....

2020-07-20 17:46:43 3422

原创 css3 梯度渐变色

<article> <h1>Gradient Text</h1> <p>linear-gradient() + background-clip + text-fill-color</p> </article>article { background: linear-gradient(to right, hsl(98 100% 62%),hsl(204 100% 59%)); -webkit-ba..

2020-07-20 15:47:56 518

原创 纯css load带文本动画

* { margin: 0; padding: 0; } html,body { width: 100%; height: 100%; background: #3498db; } /*animation begin*/#loader-container { width: 200px; height: 200px; color: white; margin: 0 auto; position: absolute; to...

2020-07-16 15:37:14 212

原创 纯css3个点加载动画

<style>html,body { width: 100%; height: 100%;}body{ background: black; font-family: 'Poppins', sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: flex; justify-content: center; a...

2020-07-16 14:41:48 1619

原创 CSS3酷炫加载动画

<style> *{ margin: 0; padding: 0; } body { display: flex; justify-content: center; align-items: center; padding-top: 50px; background: #000; } .load { position: relative; width: 150px; height: 150px;.

2020-07-02 14:43:43 309

原创 canvas-图案文字

<canvas id="canvas" width="500" height="300" style="border: 1px dashed gray;"></canvas><script type="text/javascript"> function $$(id) { return document.getElementById(id); } window.onload = function () { var .

2020-07-02 12:02:16 225

原创 svg简单动画

<style> .ball3 { animation: second-animation 2s 2s infinite alternate ease-in-out forwards; } @keyframes second-animation { 0% { fill:blue; transform:translateX(0); } 50% { fill:purple; transform:translateX(50x)...

2020-06-18 23:12:28 197

原创 Vue 组件化应用构建

在 Vue 里,一个组件本质上是一个拥有预定义选项的一个 Vue 实例。在 Vue 中注册组件很简单:// 定义名为 todo-item 的新组件Vue.component('todo-item', { template: '<li>这是个待办项</li>'})var app = new Vue(...)用它构建另一个组件模板:<ol&gt...

2020-03-08 04:51:26 260

原创 JavaScript 函数

。。。

2020-03-08 03:57:34 170

原创 JavaScript 数组

数组是值 的有序集合。每个值叫做一个元素,而每个元素在数组中有一个位置,以数字表示,称为索引。JS数组是无类型的,数组 可以是任意类型。数组的元素可能是对象也可能是数组。JS数组的索引是基于零的32位数值:第一个索引是0,最大索引是4294967294。数组继承自Array.prototype中的属性。创建数组使用数组直接量是创建数组最简单的方法,在方括号中将数组元素...

2020-03-05 08:35:31 187

原创 vue项目font-awesome的引用

1.npm install font-awesome --save-dev2.在main.js文件import'font-awesome/css/font-awesome.min.css'3.在视图 <iclass="fafa-address-book"aria-hidden="true"></i>。具体图标参考fontawesome官网...

2020-03-03 23:36:10 529

原创 JavaScript 对象

对象是js的基本数据类型。对象是一种复合值:它将很多值 聚合在一起,可通过名字访问这些值 。对象也可看种是属性的无序集合,每个属性都是一个名/值对。属性名是字符串,因此我们可以把对象看成是从字符串到值的映射。JS对象还可以从一个称为原型的对象继承属性。对象的方法通常是继承的属性。对象最常见的用法是创建create,设置set,查找query,删除delete,检测test ,枚举 ...

2020-03-03 22:15:21 309

原创 JavaScript 语句

表达式在JS中是短语,语句(statement)是JS的整句或命令。诸如赋值和函数调用这些表达式,称做为表达式语句,还有声明语句,条件语句等。表达式语句赋值语句是比较重要的表达式语句:greeting = "Hello" + name;i *= 1;复合语句和空语句可以用逗号运算符将几个表达式连接在一起,形成一个表达式。还可以将多条语句联合在一起,形成...

2020-03-03 15:22:18 388

原创 JavaScript 的一些运算符

条件运算符 (?:)也称做条件运算符。第一个操作数在"?"之前,第二个操作数在"?"和":"之间,第三个操作数在":"之后。x > 0 ? x : -x ;typeof运算符typeof是元运算符,放在其单个操作符的前面,操作数可以是任意类型。返回值为表示 操作类型的一个字符串。delete运算符delete是一元操作符,它用来删除对象属性或者数组元素。它是用...

2020-03-03 12:34:57 61

原创 JavaScript 关系表达式

1.相等和不相等运算符“=” 得到或赋值“==” 相等“===” 严格相等“!=” 不相等“!==” 不严格相等2.in运算符in运算符希望它的左操作是一个字符串或可以转换为字符串,希望它的右操作数是一个对象。如果右侧的对象拥有一个名为左操作数值的属性名,那么表达式返回true,例如:var point = { x:1,y:2};"x" in poi...

2020-03-03 12:17:00 377

原创 Javascript 类和原型 例子

在JS中,类的所有实例对象都从同一个原型对象上继承属性。因此,原型对象是类的核心如果定义一个原型对象,然后通过inherit()函数创建一个继承自它的对象,这就定义了一个Javascript类。通常,类的实例还需要进一步的初始化,通过定义一个函数来创建并初始化这个新对象。<script>//实现一个表示值的范围的类function range(from,to) { va...

2020-03-03 11:45:56 405

原创 Git 常用命令

一、 Git 常用命令速查git branch 查看本地所有分支git status 查看当前状态 git commit 提交 git branch -a 查看所有的分支git branch -r 查看远程所有分支git commit -am "init" 提交并且加注释 git remote add origin [email protected]:ndshowgit push...

2018-10-18 22:16:10 160

原创 传统javascript加载异步数据简单例子

基于XMLHttpRequest对象创建两个页面,a,b.a页面完整代码:&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=devic

2018-10-05 15:38:51 772

原创 vscode 快速生成html

1.输入! ,选择下拉项的第一个回车确认2.就生成以下html代码备注:有些文章说明输入!后按tab,我得出的结果是空格。。。

2018-10-04 23:18:42 16489 7

原创 ES6 利用扩展运算符合并数组

ES6利用扩展运算符...合并数组我们用下面的例子观察:{ // ES5 合并数组 var params = ['hello', true, 3]; var other = [1, 2].concat(params); console.log(other);} { // ES6 利用扩展运算符合并数组 var params = ['h...

2018-10-04 22:20:03 3298

原创 ES6 双冒号运算符

箭头函数可以绑定this对象,大大减少了显式绑定this对象的写法(call、apply、bind)。但是,箭头函数并不适用于所有场合,所以现在有一个提案,提出了“函数绑定”(function bind)运算符,用来取代call、apply、bind调用。函数绑定运算符是并排的两个冒号(::),双冒号左边是一个对象,右边是一个函数。该运算符会自动将左边的对象,作为上下文环境(即this对象),...

2018-10-04 20:46:52 4957

原创 ES6 箭头函数

ES6 允许使用“箭头”(=&gt;)定义函数。var f = v =&gt; v;// 等同于var f = function (v) { return v;};如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。var f = () =&gt; 5;// 等同于var f = function () { return 5 };var sum ...

2018-10-03 00:18:49 146

原创 ES6 rest 参数

ES6 引入 rest 参数(形式为...变量名),用于获取函数的多余参数,这样就不需要使用arguments对象了。rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中。function add(...values) { let sum = 0; for (var val of values) { sum += val; } return sum...

2018-10-02 04:42:36 2257

原创 HTTP--TCP连接

几乎所有的 HTTP 通信都是由 TCP/IP 承载的,TCP/IP 是全球计算机及网络 设备都在使用的一种常用的分组交换网络分层协议集。客户端应用程序可以打开一 条 TCP/IP 连接,连接到可能运行在世界任何地方的服务器应用程序。一旦连接建 立起来了,在客户端和服务器的计算机之间交换的报文就永远不会丢失、受损或 失序。TCP的可靠数据管道HTTP 连接实际上就是 TCP 连接和一些...

2018-10-02 03:49:58 1057

原创 vue 异步组件实现按需加载

 当build打包后,app.js过大的时候,可以考虑用异步组件的方式。import HomeHeader from "./components/Header";import HomeSwiper from "./components/Swiper";import HomeIcons from "./components/Icons";import HomeRecommend from...

2018-09-30 22:00:50 5163 1

原创 Vuex的高级使用及localStorage

 index.js文件import Vue from 'vue'import Vuex from 'vuex'import state from './state'import mutations from './mutations'Vue.use(Vuex)export default new Vuex.Store({ // state: state,键值一样,可...

2018-09-29 19:02:18 1141

原创 Vue Vuex 是什么

Vuex 是什么?Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension,提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。什么是“状态管理模式”?让我们从一个简单的 Vue...

2018-09-29 13:07:31 1223

原创 vue BetterScroll的安装使用

npm install better-scroll --save 视图结构:&lt;div class="wrapper"&gt; &lt;ul class="content"&gt; &lt;li&gt;...&lt;/li&gt; &lt;li&gt;...&lt;/li&gt; ... &lt;/ul&am

2018-09-28 16:53:10 2022

原创 HTTP报文如何连接

TCP/IPHTTP 是个应用层协议。HTTP 无需操心网络通信的具体细节;它把联网的细节都 交给了通用、可靠的因特网传输协议 TCP/IP。 TCP 提供了: • 无差错的数据传输;• 按序传输(数据总是会按照发送的顺序到达);• 未分段的数据流(可以在任意时刻以任意尺寸将数据发送出去)。HTTP 网络协议栈 连接、IP地址及端口号在 HTTP 客户端向服务器发送...

2018-09-28 11:24:44 1149

原创 Web的结构组件

• 代理 位于客户端和服务器之间的 HTTP 中间实体。• 缓存 HTTP 的仓库,使常用页面的副本可以保存在离客户端更近的地方。• 网关 连接其他应用程序的特殊 Web 服务器。• 隧道 对 HTTP 通信报文进行盲转发的特殊代理。• Agent 代理 发起自动 HTTP 请求的半智能 Web 客户端。 在客户端和服务器之间转发流量的代理:保存常用文档本地副本以提...

2018-09-28 10:36:26 606

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除