VirtuousIntro-CSDN博客

div.test1(ref="test1") p.test(ref="test") 跑马灯，跑起来，嗨起来~~hello world 你好世界世界你好哇test () { let boxWidth = this.$refs.test1.offsetWidth let testWidth = this.$refs.test.scrollWidth if (testWidth > boxWidth) { this.testTimer = setInterval(() =.

2022-05-11 17:31:02 1257

原创记录input只能输入数字

input.write(placeholder="请输入账号" type="number" pattern="[0-9]*")

2020-11-25 14:37:46 265

原创记录 git 常用命令

git diff master origin/master --stat 比较当前分支与远程分支的差异gitreset--hard HEAD~将版本回退，本地所有文件与远程一样git reset --soft HEAD~ 版本回退，本地代码为最新代码与远程不一样gitstash 将未处理完的变更先保存到 stash 中gitstashpoppop 不保留 stash...

2020-11-17 10:22:10 155

原创 css实现渐变边框

效果如下border-style: solid;border-width: 1px;border-image: linear-gradient(#bee6ff,#cb70fb) 1 1;注意：设置渐变边框后不支持圆角

2020-11-17 10:15:23 309

原创记录一下contenteditable属性的使用

p.test(contenteditable=true) hello world.test { position: relative; outline: none; font-size: .26rem; &:empty::before{ content: '请输入您要说明的要求'; color: #ccc; } &:focus::b...

2020-04-28 16:45:44 238

原创 js秒转换成天、时、分、秒

countdownStarts () { // this.countdown 返回距离的时间戳；单位秒 let newData = (new Date().getTime()) / 1000 // 获取当前时间转换成秒 let countDown = this.countdown - newData // 倒计时 let countDownText = '' if (coun...

2020-04-14 15:45:36 963

转载 git比较本地仓库和远程仓库的差异

更新本地的远程分支git fetch origin2.本地与远程的差集 :（显示远程有而本地没有的commit信息）git log master..origin/master3.统计文件的改动# git diff <local branch> <remote>/<remote branch>git diff --stat maste...

2020-03-26 16:59:06 1861 2

原创如何使用localStorage存储和获取，随机值

/** * 缓存随机值 * @param number {Number} 存储在本地的随机数 * @param expires {Number} 随机数randomNumber的过期时间（小时数，默认为30分钟） */setRandom (number, expires = 0.5) { let exp = new Date() exp.setTime(exp.getTime(...

2020-03-21 11:46:17 393

原创小程序保存视频/图片到相册并且授权

授权允许访问相册wx.getSetting({success(res) {if (!res.authSetting[‘scope.writePhotosAlbum’]) { // 未授权wx.authorize({scope: ‘scope.writePhotosAlbum’,success: res => { // 授权成功// 用户已经同意小程序使用相册，后续调用 wx.s...

2020-03-20 14:49:29 1924 3

原创 git提交版本回退

git reset --soft HEAD~ 回退到上一个版本，本地代码不会回到上一个版本git reset --hard HEAD~ 回退上一个版本，本地代码同时回滚到上一个版本git push -f 强制推送到远程HEAD~可以换成需要回退到的对应版本号git log 查询你需要回退到版本号git reset --soft 版本号...

2020-03-20 14:37:58 141

原创 vue超出一行文字自动向上滚动

<template> div.mine__notice(v-if="basicInfo.isNotice" ref="noticeBox") p.notice-text(ref="notices" :style="{'margin-top': - noticesMarginTop + 'px'}") {{basicInfo.noticeContent}}<...

2019-12-25 15:05:51 1818

转载判断是pc端还是移动端

export function getDeviceName () { let userAgentInfo = navigator.userAgent let Agents = ['Android', 'iPhone', 'SymbianOS', 'Windows Phone', 'iPod', 'iPad'] let flag = true for (let i = 0; i &...

2019-12-23 14:02:06 152

原创 vue控制列表的字数限制

<template lang="pug"> div.radar ul.radar__list li.radar__item(v-for="item in controlTextList" :id="item.id") img.img(:src="item.imgSrc") div.item ...

2019-06-25 16:07:11 2177 1

转载 vuejs实现图片放大镜效果

原作者地址：https://github.com/lemontree2000/vue-magnify转载优化作者地址：https://segmentfault.com/a/1190000012260414// 组件<template> <div class="magnify"> <div class="preview-box" @mous...

2019-06-25 11:59:24 2794 3

转载如何给git commit 添加一段简短且有意义的描述

如何给git commit 添加一段简短且有意义的描述每一个commit应该包括以下几部分：header，body，footerheader包括type，scope，subject<type>(<scope>): <subject><BLANK LINE><body><BLANK LINE><foot...

2019-06-14 10:48:37 2650

原创 gulp版本回退

npm install --save-dev gulp@3.9.1

2019-04-17 11:42:09 1120

转载小程序canvas绘制图片

在生成图片时遇到以下问题：canvas绘制文字不能换行，如果文字的长度大于你所定的宽度的话，文字会超出你所定宽度，或者文字会挤压变形解决方法：（1）截取一定的文字长度，多余的文字省略（2）通过技术来使文字换行，我们的需求就是文字换行。微信小程序canvas画图必须用本地的图片路径，所以要把图片下载下来存为临时路径再绘制图片。微信提供了个api可用：wx.downloadFile...

2019-04-04 17:59:16 646

转载瀑布流

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"&

2018-12-21 16:10:05 142

转载 js获取鼠标选中的文字(复制的时候安卓可以选中)

1、获取选中的文字：document.selection.createRange().text; IE9以下使用window.getSelection().toString(); 其他浏览器使用$('p').mouseup(function(){ var txt = window.getSelection?window.getSelection():document.sele...

2018-09-10 17:50:26 1016 2

转载 canvas圆

<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximu

2018-09-06 16:05:47 117

原创 gulp创建自动化工具

1.新建一个文件夹例如：myweb建立在D盘中，然后打开终端（cdm => D: => cd myweb）执行一步按一次回车，找到了新建文件夹的位置2.输入npm init 一直回车(也可以直接输入npm init -y直接建立不需要按很多回车)，这里是自动建立package.json文件3.全局安装gulp: npm install --global gulp 4....

2018-07-31 22:15:35 219

转载 gulp压缩js报错

gulp压缩js报错，也许你需要用到babel今天在使用gulp 压缩js时，遇到了这样的错误：从网上找了找原因，有网友说： js不知道哪里用到了es6语法，为了解决压缩js报错抱着试一试的心态，步骤如下：1.全局安装Babel。 npm install -g babel-cli npm install -g babel-cli --save-dev 2...

2018-07-30 14:08:25 2505

转载 gulp常用插件整理

1.gulp-less（less编译）2.gulp-pug (pug编译)3.gulp-sass(sass编译)4.gulp-compass(sass编译)5.gulp-autoprefixer(添加CSS3前缀)6.gulp-clean-css(压缩CSS)7.gulp-include（文件包含）8.gulp-concat(文件合并)9.del(文件删除)10...

2018-07-29 21:10:57 332

原创 js判断是上滑动还是下滑动

let scrollY = window.scrollY; // 初始值$(window).on('scroll', funcation() { let currentY = window.scrollY; if(currentY < = scroollY) { // 向下滑动 $(element).hide() } els...

2018-07-19 12:04:54 2710

原创 html怎么引入icon(矢量图)

1、首先在阿里巴巴图标矢量库里面创建一个属于自己的开发项目，然后把对应的图标加入到自己的项目中。2、查看在线链接并复制到自己新建的css文件里面去3、在文章里面引入对应的文件既可使用...

2018-07-07 17:25:50 22520

原创修改input复选框的样式

<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><style type="text/css">.test {position: relative;}input {width:

2018-07-05 09:22:00 847

原创小程序禁止弹框下面的内容滑动

加上catchtouchmove='true' 这个属性就可以<view class="complaints-bounced" hidden="{{bounced}}" catchtouchmove='true'> <view class="mask"></view> <view class="complaints-content&a

2018-07-03 13:54:24 3961 1

原创禁止弹出框下面的内容滑动

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

2018-03-12 22:09:19 1465

原创 jq制作简单的tab

ul{list-style: none;margin: 0;padding: 0;position: relative;}ul li{width: 20%;float: left;background:orange;text-align: center;color: #fff;}.active{background: orangered;}div{position: absolute;

2018-02-02 09:51:16 221

原创单行文本隐藏和显示多行文本隐藏

一行显示不全用省略号显示overflow: hidden;text-overflow:ellipsis;white-space:nowrap多行文本显示后显示不全用省略号显示的overflow: hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient

2018-01-29 17:02:41 855

转载关于H5移动端开发 iPhone X适配

一、　媒体查询、@media screen and (device-width:375px) and (device-height:812px){ #header { height: 88px; padding-top: 44px !important; } .mui-content { padding-top: 88

2018-01-14 10:59:10 2679

原创 vue简单的添加与删除

添加Vue.component('todo-item', {template: '{{ title }}X', props: ['title']});var exampleVm=new Vue({ el: '#todo-list-example', data: { newTodoText: '', todos: [//

2018-01-12 09:20:21 2015