Font Awesome 一套绝佳的图标字体库和CSS框架 Font Awesome是一套完美的图标字体库,供可缩放的矢量图标,您可以使用CSS所提供的所有特性对它们进行更改,包括:大小、颜色、阴影或者其它任何支持的效果。
vue中@click点击阻止事件冒泡 大家都知道,vue中点击事件直接在元素中使用@click="click"即可,但是有时在一个元素中包含了子元素,而且父元素和子元素都有点击事件,此时我们希望的点击效果就是:点击子元素区域的的时候,不触发父级元素的点击事件,此时就要用到@click.stop=“方法名字”。@click.stop 阻止事件冒泡@click.prevent 阻止事件的默认行为<!-- 阻止单击事件继续传播 --><view @click.stop="方法名字"></view>..
flexible.js淘宝官方h5移动适配解决方案 flexible.js淘宝官方h5移动适配解决方案.创建flexible.js , 主要内容为:;(function(win, lib) { var doc = win.document; var docEl = doc.documentElement; var metaEl = doc.querySelector('meta[name="viewport"]'); var flexibleEl = doc.querySelector('meta[name="flexib
前端js获取当前时间的方法 var time = new Date();time.getYear(); //获取当前年份time.getFullYear(); //获取完整的年份(4位,1970-???)time.getMonth(); //获取当前月份(0-11,0代表1月)time.getDate(); //获取当前日(1-31)time.getDay(); //获取当前星期X(0-6,0代表星期天)time.getTime(); //获取当前时间(从1970.1.1开始的毫秒数)time.getHours(); /
js获取当前页面路由方法 在WEB开发中,时常会用到javascript来获取当前页面的url网址信息,在这里是我的一些获取url信息的小总结。下面我们举例一个URL,然后获得它的各个组成部分:https://blog.csdn.net/jia2799897415?spm=1000.2115.3001.53491.window.location.href(设置或获取整个 URL 为字符串)var test = window.location.href;alert(test);返回:https://blog.csdn.ne
vue和微信小程序的区别 一、生命周期vue生命周期小程序生命周期相比之下,小程序的钩子函数要简单得多。vue的钩子函数在跳转新页面时,钩子函数都会触发,但是小程序的钩子函数,页面不同的跳转方式,触发的钩子并不一样。onLoad: 页面加载一个页面只会调用一次,可以在 onLoad 中获取打开当前页面所调用的 query 参数。onShow: 页面显示每次打开页面都会调用一次。onReady: 页面初次渲染完成一个页面只会调用一次,代表页面已经准备妥当,可以和视图层进行交互。对界面的设置如wx.setNav
js图片懒加载 html中内容,img的src放入懒加载的动态图,data-src中放入真实的图片。 <img src="懒加载的图片" data-src="真实图片" alt="">js代码,记得引入jQuery.js ,我没有封装js,你可以根据自己需求封装一个js文件 var clock; //这里的clock为timeID, //滚动区域, $('.container').on('scroll', function () {
Vue 项目性能优化方案 前言Vue 框架通过数据双向绑定和虚拟 DOM 技术,帮我们处理了前端开发中最脏最累的 DOM 操作部分, 我们不再需要去考虑如何操作 DOM 以及如何最高效地操作 DOM;但 Vue 项目中仍然存在项目首屏优化、Webpack 编译配置优化等问题,所以我们仍然需要去关注 Vue 项目性能方面的优化,使项目具有更高效的性能、更好的用户体验。本文是作者通过实际项目的优化实践进行总结而来,希望读者读完本文,有一定的启发思考,从而对自己的项目进行优化起到帮助。本文内容分为以下三部分组成:Vue 代码层面的优
cli3 vue-router-----路由的配置及使用方法 一.什么是vue-routervue-router路由插件,这里的路由并不是指我们平时所说的硬件路由器,这里的路由就是SPA(单页应用)的路径管理器。再通俗的说,vue-router就是我们WebApp的链接路径管理系统。二.vue-router安装npm install vue-router --save-dev三.在src文件夹中创建routes.js配置文件,配置路由的映射关系import ShowBlog from "./components/ShowBlog"import AddBl
Vue-cli3如何添加路由(vue-router) 之前使用的vue-cli2的是否可以在创建项目时直接引入vue-router,但是现在Vue-cli3新建项目后却少了很多东西,我们需要自己来安装使用路由。具体方案如下:安装路由npm install vue-router创建router.js与main.js同级router.js中的内容为import Vue from 'vue'import Router from 'vue-router' //组件模块import Main from './components/content/ma
vue实现移动端适配方案 (amfe-flexible和postcss-pxtorem结合)建议收藏 1.amfe-flexibleamfe-flexible是配置可伸缩布局方案,主要是将1rem设为viewWidth/10。2.postcss-pxtorempostcss-pxtorem是postcss的插件,用于将像素单元生成rem单位。3.移动端适配方案vue实现移动端适配步骤如下:先安装amfe-flexible和postcss-pxtoremnpm install amfe-flexible --savenpm install postcss-pxtorem --save在m
模仿微信朋友圈 图片浏览 js javascript 支持图片预览,滑动切换,双指缩放,图片缓存 首先引入一下两个js文件,<script src="dist/md5.js"></script><script src="dist/previewImage.min.js"></script>整个HTML文件<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>PreviewImage&l
input上传视频并本地预览 <input id="uploaderInput" class="weui-uploader__input" onchange="chooseVideoInput()" accept="video/*" multiple="" type="file"><video src="" controls id="video" style="width: 8rem"></video> <script> function chooseVideoIn