自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(70)
  • 问答 (4)
  • 收藏
  • 关注

原创 Gulp练习

var gulp =require('gulp');var concat=require('gulp-concat');var uglify=require('gulp-uglify');var rename=require('gulp-rename');//注册任务gulp.task('js',function () { return gulp.src('src/js/*.j...

2019-08-01 17:51:34 123

原创 Vue Ajax请求

main入口引入resource插件//入口jsimport Vue from 'vue'import App from './App'import './commponents/css/base.css'import VueResource from 'vue-resource'Vue.use(VueResource)new Vue({ el:'#app', compon...

2019-07-24 16:33:26 119

原创 Vue组件切换练习

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="app"> <a href="" @clic...

2019-07-21 11:20:52 171

原创 Vue列表动画练习

技术点:transition-group<!DOCTYPE html>:<html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> li { borde...

2019-07-20 17:00:13 177

原创 Vue练习动画

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js"></script> <style> ...

2019-07-20 16:15:48 81

原创 vue练习

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><script src="vue.js"></script><link rel="s...

2019-07-19 15:34:41 71

原创 jQuery轮播图

$(function () { //实现按钮平滑切换 var $container = $('#container') var $list = $('#list') var $points = $('#pointsDiv>span') var $prev = $('#prev') var $next = $('#next') var PAGE_WIDTH = 60...

2019-07-17 15:23:37 99

原创 Vue基于脚手架编写项目

**1.**创建副组件HelloWorld在compoments包下<template> <div> <p class="msg">{{msg}}</p> </div></template><script> export default { data(){ return...

2019-07-04 15:41:14 411

原创 Vue自定义指令

directives:{ 'lower-text':function (el,binding) { el.textContent=binding.value.toLowerCase() } }

2019-07-04 10:28:46 64

原创 Vue动画

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .xxx-enter-active,.xxx-leave-active{ trans...

2019-07-03 18:03:07 68

原创 Vue表单

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="demo"><form action="xxx" ...

2019-07-03 16:26:04 87

原创 Vue绑定监听

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="demo"><h2>绑定监听</h2&...

2019-07-03 15:30:22 142

原创 Vue遍历数组

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="demo"><h2>遍历数组</h2&...

2019-07-02 16:37:21 867

原创 Vue条件渲染

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="demo"><p v-if="ok">成功&...

2019-07-02 15:38:15 67

原创 Vue强制绑定class和style

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> .aClass{ color: red; } ....

2019-07-02 15:16:17 101

原创 Vue学习

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="demo">姓:<input type="text...

2019-07-02 14:43:24 63

原创 初识Vue

<script type="text/javascript" src="vue.js"></script><script type="text/javascript"> const vm=new Vue({ el:"#app", data:{ username:'aayybb' }...

2019-06-23 20:39:29 120

原创 防止统一事件频繁调用(此处例子为滚轮)

if (content.addEventListener) { content.addEventListener("DOMMouseScroll", function (ev) { //content.addEventListener("DOMMouseScroll", fn );如果不需要只要fn()翻页动画函数 ...

2019-06-21 22:18:51 205

原创 实时矫正内容位置

var arrowEl = document.querySelector("#head>.headMain>.arrow"); var liNodes = document.querySelectorAll("#head .headMain>.nav>.list>li"); var upNodes = document.querySel...

2019-06-21 22:15:33 88

原创 飘散气泡

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

2019-06-16 22:25:49 78

原创 泡泡效果canvas

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

2019-06-16 21:37:20 163

原创 滚轮方向兼容

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> .wrap{ width: 200px; hei...

2019-06-16 17:00:37 53

原创 滚轮兼容

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> .wrap{ width: 200px; hei...

2019-06-16 16:51:43 55

原创 扇形导航

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="wrap"> <div class="inne...

2019-06-13 22:21:19 113

原创 光斑loge

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

2019-06-12 21:07:26 134

原创 css3圆角

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> html,body{ height: 100%; ...

2019-06-11 21:38:57 67

原创 图片垂直居中

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> #wrap{ width: 400px; hei...

2019-06-10 21:59:42 104

原创 未知宽高盒模型垂直居中

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

2019-06-10 20:51:24 83

原创 盒模型垂直水平居中(开启定位)

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

2019-06-10 20:32:44 140

原创 粘连式布局

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

2019-06-08 21:10:12 202

原创 圣杯布局

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

2019-06-08 11:34:12 58

原创 mac停靠栏

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

2019-06-02 11:30:10 188

原创 钢琴音阶导航

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

2019-05-29 17:43:44 432

转载 canvas实现刮刮卡

<!DOCTYPE html><html lang="en"><meta> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"> </meta&g...

2019-05-28 18:31:49 76

原创 canvas实现动画

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> #text{ right: 0; left: 0...

2019-05-27 20:03:03 132

原创 canvas实现钟表

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><canvas id="text" height="400" width="400"...

2019-05-26 21:28:00 88

原创 canvas实现表盘

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><canvas id="text" height="400" width="400"...

2019-05-26 13:15:28 340

原创 canvas简单动画

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><canvas id="text" height="300" width="300"...

2019-05-26 11:12:05 527

原创 canvas画布画圆

Title![水水水水](https://img-blog.csdnimg.cn/20190525203340539.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDU1MjU...

2019-05-25 20:33:56 339

原创 canvas实现签名版

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> window.onload=functio...

2019-05-25 17:35:44 816

空空如也

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

TA关注的人

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