自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

原创 vue用命令直接修复ESLint

在做vue-cli项目的时候,碰到空格和换行就会报错 报错长这样: 网上百度的方法 : 找到package.json 文件,找到里面的scripts, 将 "lint": "vue-cli-service lint" 修改如下 : ...

2019-08-02 16:02:37

阅读数 746

评论数 0

原创 vue通过路由跳转页面的三种方式

现有如下场景,点击父组件的li元素跳转到子组件中,并携带参数,便于子组件获取数据。 父组件中: <li v-for="item in list" @click="getDescribe(article.id)"> <liv-for=...

2019-06-27 23:19:21

阅读数 747

评论数 0

原创 vue严格模式报错问题

vue3.x以后,代码的格式要求更加严格,所以“use strict”的使用就必不可少了。但是经常也会遇到代码格式正确,一保存就会出现报错,在网上找的解决办法,: 在script 添加如下代码即可:/*eslint-disable*/ 注意:/* 不能少 代码如下: <templa...

2019-06-26 22:05:10

阅读数 344

评论数 1

原创 Mint UI的使用

1、安装 npm install mint-ui -S -S表示 --save 2、在main.js中引入mint Ui的css 和 插件 import Mint from 'mint-ui'; Vue.use(Mint); import 'mint-ui/l...

2019-06-25 21:35:49

阅读数 28

评论数 0

转载 webpack的使用

安装 Webpack可以使用npm安装,新建一个空的练习文件夹(此处命名为webpack sample project),在终端中转到该文件夹后执行下述指令就可以完成安装。 //全局安装 npm install -g webpack //安装到你的项目目录 npm install --sav...

2019-06-20 21:44:25

阅读数 25

评论数 0

原创 vue路由

1.在 VUE-CLI根目录下的SRC中的main.js中引入了路由器; //main.js import Vue from 'vue' import App from './App' import router from './route.js&...

2019-06-19 21:31:05

阅读数 14

评论数 0

原创 vue组件

1.组件化 在大型应用开发的时候,页面可以划分成很多部分。往往不同的页面,也会有相同的部分。例如可能会有相同的头部导航、尾部信息模块。 但是如果每个页面都独自开发,这无疑增加了我们开发的成本。所以我们会把页面的不同部分拆分成独立的组件,然后在不同页面就可以共享这些组件,避免重复开发。 1.1...

2019-06-18 22:21:51

阅读数 17

评论数 0

原创 vue中实现动画的几种方式

一.使用vue的transition标签结合css样式完成动画 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset=...

2019-06-17 22:28:21

阅读数 472

评论数 0

原创 vue.js

ViewModel是Vue.js的核心,它是一个Vue实例。Vue实例是作用于某一个HTML元素上的,这个元素可以是HTML的body元素,也可以是指定了id的某个元素。 当创建了ViewModel后,双向绑定是如何达成的呢? 首先,我们将上图中的DOM Listeners和Data Bind...

2019-06-13 21:02:35

阅读数 19

评论数 0

原创 初识vue

每个 Vue 应用都需要通过实例化 Vue 来实现。 例子如下: import Vue from "vue"; var MainCtrl=new Vue({ ... }); new Vue({})中参数对象属性解析 el el是CSS 选择器,用于查询元素的 如 el:&...

2019-06-10 22:51:15

阅读数 16

评论数 0

原创 swiper插件

swiper.min.js插件实现多种滑动效果,可在pc、手机、平板中使用。 该插件官方网址:http://www.swiper.com.cn/(版本3)、http://2.swiper.com.cn/(版本2.X)里面可以下载该插件,而且有相应的实例。 例外最近发现还有swiper相关的交流...

2019-05-26 21:35:52

阅读数 76

评论数 0

原创 常用的本地缓存机制

常用的几种本地缓存机制:Cookie,LocalStorge,SessionStorge 1.Cookie的特点 1)cookie的大小受限制,cookie大小被限制在4KB,不能接受像大文件或邮件那样的大数据。 2)只要有请求涉及cookie,cookie就要在服务器和浏览...

2019-05-24 21:18:51

阅读数 87

评论数 0

原创 jquery与zepto的异同

Zepto最初是为移动端开发的库,是jQuery的轻量级替代品,因为它的API和jQuery相似,而文件更小。Zepto最大的优势是它的文件大小,只有8k多,是目前功能完备的库中最小的一个,尽管不大,Zepto所提供的工具足以满足开发程序的需要。大多数在jQuery中·常用的API和方法Zepto...

2019-05-22 20:57:35

阅读数 21

评论数 0

原创 less的适配

之前有些适配做法,是通过js动态计算viewport的缩放值(initial-scale)。 例如以屏幕320像素为基准,设置1,那屏幕375像素就是375/320=1.18以此类推。 但直接这样强制页面缩放过于粗暴,会导致页面图片文字失真模糊。 Px是相对固定单位,字号大小直接被定死,所以...

2019-05-21 21:55:58

阅读数 164

评论数 0

转载 less的基本用法

Rem,媒体查询适配方案 Less基础语法介绍 作用: 维护CSS, 按照CSS的基本语法去写. 变量 ☞@自定义变量名: 值; 例如: @nav_bgcolor: red; nav { color: @nav_bgcolor; } ☞变量的运算: @width: ...

2019-05-20 22:32:09

阅读数 29

评论数 0

转载 回调函数callback

什么是回调函数? 我们绕点远路来回答这个问题。 编程分为两类:系统编程(system programming)和应用编程(application programming)。所谓系统编程,简单来说,就是编写库;而应用编程就是利用写好的各种库来编写具某种功用的程序,也就是应用。系统程序员会给自己写...

2019-05-19 20:40:22

阅读数 15

评论数 0

原创 响应式布局

第一步:在网页代码的头部,加入一行viewport元标签 (1)viewport是网页默认的宽度和高度,上面这行代码的意思是:网页宽度默认等于屏幕宽度 (width=device-width),原始缩放比例(initial-scale=1)为1.0,即网页初始大小占屏幕面积的100%。 <...

2019-05-18 23:23:58

阅读数 11

评论数 0

原创 媒体查询

Media Queries能在不同的条件下使用不同的样式,使页面在不同在终端设备下达到不同的渲染效果。前面简单的介绍了Media Queries如何引用到项目中,但Media Queries有其自己的使用规则。具体来说,Media Queries的使用方法如下。 注意:使用Media Queri...

2019-05-16 22:18:04

阅读数 7

评论数 0

原创 移动端touch事件

Touch 事件 首先 touch 包含三类事件,它们分别是:touchstart、touchmove、touchend 。望文生义这种本能相信你应该会有,但在这里我还是有必需对这三个词进行一翻不必要的解释。 touchstart:手指触摸到一个 DOM 元素时触发。 touchmove:手...

2019-05-15 21:27:28

阅读数 11

评论数 0

原创 移动web

什么是移动WEB开发,将网页更好的显示在移动端的一些设置,简单来说就两点如下: 1、流式布局,即百分比自适应布局 将body下的div容器的样式设置如下: div{ width:100%; } 2、viewport视口 在head标签中,添加如下: <meta name=&quo...

2019-05-14 21:52:27

阅读数 19

评论数 0

原创 使用canvas绘制等分圆

代码如下 : <body> <canvas width="600" height="500" id="cvs"></canvas> </body> var canvas = d...

2019-05-13 21:55:24

阅读数 316

评论数 1

原创 H5 canvas的使用

Canvas是HTML5新增的组件,它就像一块幕布,可以用JavaScript在上面绘制各种图表、动画等。 //绘制矩形 var canvas4 = document.getElementById('test_canvas4');//获取绘图区域 var ct...

2019-05-12 21:56:44

阅读数 146

评论数 0

原创 canvas绘制三角形

<body> <canvas id="cvs" width="600" height="600" style="border: 1px solid #00a4ff;"></canvas&g...

2019-05-09 21:23:34

阅读数 347

评论数 0

原创 stellar制作视差滚动效果

html 单个元素选项中data-stellar-background-ratio比较常用。 接受一个正整数的值,可以改变它被应用到元素的影响速度。 例如,data-stellar-background-ratio="0.5"意味着改变速度为自然滚动速度的一半。 如果想使这个...

2019-05-07 19:26:17

阅读数 29

评论数 0

原创 伸缩布局

CSS3引入了一种新的布局模式——Flexbox布局,即伸缩布局盒模型(Flexible Box),用来提供一个更加有效的方式制定、调整和分布一个容器里项目布局,即使它们的大小是未知或者动态的,这里简称为Flex。 Flexbox布局常用于设计比较复杂的页面,可以轻松的实现屏幕和浏览器窗口大小发...

2019-05-06 21:10:51

阅读数 53

评论数 0

转载 css和js实现流星雨

<template> <div > ============================流星雨============================ <div class="title"> <div...

2019-05-05 21:56:39

阅读数 90

评论数 0

原创 H5动画

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> img{ ...

2019-05-04 20:50:56

阅读数 228

评论数 0

原创 css3

2D转换:移动、缩放、转动、拉长或拉伸. 注:2D转换是整个坐标系在转换,物体在坐标系中坐标并没有变化。 位移: transform:translate(100px,200px);//向右移动100px,向下移动200px. 附:translateX(n),translateY(n) 转动: tr...

2019-04-29 23:09:44

阅读数 22

评论数 0

原创 css3动画实例

<html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> ...

2019-04-28 20:22:57

阅读数 190

评论数 0

转载 H5实现3D动画

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport"...

2019-04-27 20:59:27

阅读数 499

评论数 0

原创 css3盒子阴影

用法 •box-shadow:[inset]x y blur [spread] color •参数 inset:投影方式 inset:内投影 <style> .box{width:100px;height:100px;margin:100px;background:Red...

2019-04-25 21:37:09

阅读数 242

评论数 0

转载 json和jsonp的区别

json返回的是一串数据;而jsonp返回的是脚本代码(包含一个函数调用); JSON其实就是JavaScript中的一个对象,跟var obj={}在质上完全一样,只是在量上可以无限扩展。简单地讲,json其实就是JavaScript中的对象(Object)和数组(Array,其实也是对象)这...

2019-04-24 22:32:45

阅读数 19

评论数 0

原创 jquery的ajax

AJAX = 异步 JavaScript 和 XML。 AJAX 是一种用于创建快速动态网页的技术。 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。 AJAX 不是新的编程语言,而是一种使用现有标准的新...

2019-04-23 18:47:49

阅读数 24

评论数 0

原创 jquery常用插件

插件是以jQuery的核心代码为基础,编写出符合一定规范的应用程序,并将程序进行打包,调用时,仅需要包含该打包后的JS文件即可。如需要使用表单插件,按下列步骤就可实现插件的调用: (1)在页面中导入包含表单插件的JS文件,并确定它定位与主jQuery库后,其代码如下: <head>...

2019-04-22 20:11:40

阅读数 25

评论数 0

原创 CSDN代码块显示颜色

很多刚开始玩CSDN的程序猿肯定都会有这样一个问题,为什么看别人的博客中的代码都是有颜色的,而自己的代码块却是没有颜色的 比如这样是没有颜色的 <body> <input type="button" value="点击" id=&quo...

2019-04-21 21:00:28

阅读数 55

评论数 0

原创 jquery基础事件

1. 事件绑定 $("button").bind("click", function() { alert("ok"); }) $("button").bind("click mouseover&quo...

2019-04-18 19:04:48

阅读数 37

评论数 0

原创 jquery笔记

一. DOM(Document Object Modle 的缩写)意思是文档对象模型。根据W3CDOM规范,Dom是一种与浏览器,平台,语言无关的接口,使用该接口可以轻松访问访问页面中所有标准组件。简单说,DOM解决了Netscape的javaScript和Microsoft的Jscript之间的...

2019-04-17 19:24:33

阅读数 22

评论数 0

原创 jQuery中prop的用法

添加并移除名为 "color" 的属性: $("button").click(function(){ var $x = $("div"); $x.prop("color","FF0000&q...

2019-04-16 22:09:07

阅读数 260

评论数 0

原创 jquery实现手风琴效果

<ul class="parentWrap"> <li class="menuGroup"> <span class="groupTitle">标题1</span> &l...

2019-04-15 21:28:48

阅读数 59

评论数 0

转载 javascript对数组和json数组的操作

经常使用javascript对数组和json数组进行操作,但是时间久了就忘记咋操作的了,所以这里简单记录一下 直接看代码吧 <!DOCTYPE html> <html lang="en"> <head> <meta charse...

2019-04-14 22:17:55

阅读数 58

评论数 0

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