vue使用v-if v-show页面闪烁,div闪现的解决 在页面层次结构,数据较多的时候,用v-if或者v-show就会出现div闪现,或者部分闪烁的结果。可以在根元素添加v-cloak来解决,并且设置它的样式即可。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> /* 在引入的css文件中写入这个*/...
H5中添加video视频 1,下面是一个播放视频的最简单样例(controls属性告诉浏览器要有基本播放控件)<video src="hangge.mp4" controls></video>2,通过width和height设置视频窗口大小<video src="hangge.mp4" controls width="400" height="300"></video>3,预加载媒体文件设置preload不同的属性值,可以告诉浏览器应该怎样加载一个媒..
VS Code 快捷键(中英文对照版) 常用 General按 Press 功能 Function Ctrl + Shift + P,F1 显示命令面板 Show Command Palette Ctrl + P 快速打开 Quick Open Ctrl + Shift + N 新窗口/实例 New window/instance Ctrl + Shift + W 关闭窗口/实例 Clo...
vue-cli脚手架中webpack配置基础文件详解 一、前言vue-cli是构建vue单页应用的脚手架,输入一串指定的命令行从而自动生成vue.js+wepack的项目模板。这其中webpack发挥了很大的作用,它使得我们的代码模块化,引入一些插件帮我们完善功能可以将文件打包压缩,图片转base64等。后期对项目的配置使得我们对于脚手架自动生成的代码的理解更为重要,接下来我将基于webpack3.6.0版本结合文档将文件各个击破,纯干料。重点...
vue-cli的使用步骤 vue-cli 是 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目GitHub地址是:https://github.com/vuejs/vue-cli一、安装vue-cli:全局安装 vue-cli:npm install -g vue-cli但是这种安装方式比较慢,推荐使用国内镜像来安装,所以我们先设置 cnpm:npm install -...
微信小程序canvas与wx:if的出现的问题 微信小程序canvas与wx:if的漏洞 问题描述当使用wx:if="{{showStatus}}" 去切换canvas 的消失与出现时,第一次渲染会成功当关闭即设置showStatus为false,然后再次设置showStatus为true,会发现canvas 标签出现,但是内容为空解决方案1、this.setData({ showStatus为true }...
常用的正则表达式 正则表达式的元字符元字符 名称 匹配对象 * 星号 零次或多次 + 加号 一次或多次 ? 问好 零次或一次 . 点号 单个任意字符 [...] 字符组 列出的任意字符 [^...] 点号 未列出的任意字符 ^ 脱字符 行的起始位置 $ 美元符 行的结束为止...
如何通过js和jquery获取图片真实的宽度和高度 1、什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图。然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往往都是按照图片的原尺寸来展示,如果手机屏幕太小,太大的图就会超出去!这时候有两种解决办法1)给所有的图片加上这样的样式.news img{margin:5px a...
web端 网页端分享功能的实现 思路web端 网页端分享功能的实现。我们看微信的分享开发者文档,可以知道使用微信JS-SDK可以实现网页在微信里的分享。微信JS-SDK说明文档也就是说 在微信浏览器中打开的网页 才能调用 该分享功能。但是我们是PC端打开的web,网页。怎么实现分享呢。因为微信现在已经屏蔽了来自外部的分享链接。所以我们的思路是 点击分享 按钮后 弹出一个 网页 或者 我们要分享的网页的 二...
js清除浏览器缓存的几种方法 关于浏览器缓存浏览器缓存,有时候我们需要他,因为他可以提高网站性能和浏览器速度,提高网站性能。但是有时候我们又不得不清除缓存,因为缓存可能误事,出现一些错误的数据。像股票类网站实时更新等,这样的网站是不要缓存的,像有的网站很少更新,有缓存还是比较好的。今天主要介绍清除缓存的几种方法。清理网站缓存的几种方法meta方法//不缓存<META HTTP-EQUIV="pragma" ...
skrollr.js中文教程 skrollr.js是一款轻量级且强大的js库,关于这款js库的相关的详细教程却不多。所以这里根据国内一些大神们的笔记和skrollr官方文档进行总结,方便自己以后查阅,也方便大家学习。这里主要参考了 Shimily大神的skrollr中文教程,在这个基础上进行改进和完善。有什么不妥之处,还希望大家能够及时指出,共同修改。一、skrollr 相关地址链接:skrollr官方地址 ...
flexible.js 移动端自适应方案 一,flexible.js 的使用方式:github地址:https://github.com/amfe/lib-flexible官方文档地址:https://github.com/amfe/article/issues/17本文中有部分内容引至上面这个文档。(一),引用方式1,引用cdn地址<script src="http://g.tbcdn.cn/mtb/lib-...
jQuery Easing 使用方法及其图解 从jQuery API 文档中可以知道,jQuery自定义动画的函数.animate( properties [, duration] [, easing] [, complete] )有四个参数:properties:一组包含作为动画属性和终值的样式属性和及其值的集合 duration(可选):动画执行时间,其值可以是三种预定速度之一的字符串("slow", "normal", or "f...
html前端使用高德地图入门教程,并在地图上标记位置 准备工作 注册Key 首先,注册开发者账号,成为高德开放平台开发者 登陆之后,在进入「应用管理」 页面「创建新应用」 为应用添加 Key,「服务平台」一项请选择「 Web 端 ( JSAPI ) 」 记住这个Key,等会要用,以后可能也会用,一定要记住。 页面上的准备新建一个DIV,作为地图的容器(这一步和使用其他插件一样,必...
H5唤醒本地APP(谷歌地图、百度地图等相通) 说一下兼容性问题:IOS:safari浏览器,google浏览器,UC浏览器可用QQ浏览器无法使用,其他的没测。Android:只有google浏览器可以打开谷歌地图,百度地图没测试。首先:判断当前操作环境与浏览器内核:let browser = { versions: function () { let u = navigator.userAge...
移动端html5网页a标签实现打电话、发短信 采用url链接的方式,实现在safari ios,android 浏览器,webos 浏览器,塞班浏览器,ie,operamini等主流浏览器,进行拨打电话功能。1.最常用WEB页面JS实现一键拨号的电话拨打功能:<a href="tel:13764567708">移动WEB页面JS一键拨打号码咨询功能</a>在拨号界面,显示号码,并提示拨打。支持大部分的浏览...
移动端页面a input去除点击效果 及 pc端切换 1 手机端页面a button input去除点击效果以及闪屏问题 添加:a,button,input { -webkit-tap-highlight-color: rgba(255, 0, 0, 0);}2 使用border创建小三角形span { height: 0px; width: 0px; border-t...
微信小程序 获取地理位置(省市县) 配置过程:1、在腾讯平台申请自己的秘钥http://lbs.qq.com/console/mykey.html一定要记住自己的秘钥,程序中会用到2、小程序平台设置request安全域名https://apis.map.qq.com3、下载腾讯地图api js文件链接:https://pan.baidu.com/s/1rafwusj2raOMLNIcyMOnhg提取码:1w...
仿响应式html:JavaScript判断设备处于PC端还是移动端 我们想要的效果是pc文件和mobile文件统一入口,适配不同的设备。先看看项目的目录:在index.html里面配置js控制选择那一个文件夹下的文件就可以了。我们要利用:Navigator 对象,Navigator 对象包含有关浏览器的信息。index.html很简单,直接上码吧:<!DOCTYPE html><html> <...