上一页 1 ··· 7 8 9 10 11 12 13 14 15 下一页
2017年2月22日
vuejs2.0实现分页组件，使用$emit进行事件监听数据传递
摘要： 上一篇文章介绍了vuejs实现的简单分页，如果我有几个页面都需要有分页效果，不可能每个页面都去复制一下这段代码吧，意思是封装一下，变成通用的组件。 首先使用基础 Vue 构造器，创建一个“子类”,Vue.extend( options ) 这儿创建了一个全局的pagenav，可以在其它地方都可以调用 阅读全文
posted @ 2017-02-22 14:03 风雨后见彩虹 阅读(9819) 评论(0) 推荐(0) 编辑
vuejs2.0实现一个简单的分页
摘要： 用js实现的分页结果如图所示： css 模版 js 调用 new Vue({参数}) 就是创建了一个基本的组件,赋值给变量 pageBar.el就是element的缩写,定位模版的位置.data就是数据了.知道了总页数但是要显示页码还是要一番计算,所以显示页码就是计算属性了.所以我们要用comput 阅读全文
posted @ 2017-02-22 09:48 风雨后见彩虹 阅读(32645) 评论(1) 推荐(3) 编辑
2017年2月21日
vuejs2.0使用Sortable.js实现的拖拽功能
摘要： 简介 在使用vue1.x之前的版本的时候，页面中的拖拽功能，我在项目中是直接用的jquery ui中的sortable.js，只是在拖拽完成后，在update的回调函数中又重新排序了存放数据的数组。但是当把vue升级到2.0以上后发现拖拽功能失效了，于是使用了下面代码。 该案例主要是在用于vuejs 阅读全文
posted @ 2017-02-21 13:38 风雨后见彩虹 阅读(48403) 评论(7) 推荐(7) 编辑
2017年2月17日
JavaScript之Number、String、Array常用属性与方法手册
摘要： Number isFinite函数 Number.isFinite() 方法用来检测传入的参数是否是一个有穷数（finite number）。 语法： 例： Polyfill parseInt() Number.parseInt() 方法可以根据给定的进制数把一个字符串解析成整数 语法： strin 阅读全文
posted @ 2017-02-17 10:00 风雨后见彩虹 阅读(1408) 评论(1) 推荐(1) 编辑
CSS3效果：5种预载动画效果
摘要： 实现如图所示的动画效果： 预载动画一：双旋圈 在两个不同方向旋转的圆圈。我们对内圈的转速定义了一个CSS代码，即内圈比外圈的速率快2倍。实现如图所示： html代码： css代码： 预载动画二：交错圈 两个圆圈进行横向交错来回移动。每个圆圈都设置了单独的反向移动动画参数。效果： html代码： cs 阅读全文
posted @ 2017-02-17 08:47 风雨后见彩虹 阅读(2774) 评论(3) 推荐(6) 编辑
2017年2月13日
vuejs 1.x - 实例：搜索过滤
摘要： 结果如图所示，可以搜索过滤，点击table th可以降序，升序排列当前列 阅读全文
posted @ 2017-02-13 15:03 风雨后见彩虹 阅读(1037) 评论(0) 推荐(0) 编辑
window.requestAnimationFrame与Tween.js配合使用实现动画缓动效果
摘要： window.requestAnimationFrame 概述 window.requestAnimationFrame()这个方法是用来在页面重绘之前，通知浏览器调用一个指定的函数，以满足开发者操作动画的需求。这个方法接受一个函数为参，该函数会在重绘前调用。 注意: 如果想得到连贯的逐帧动画，函数 阅读全文
posted @ 2017-02-13 11:17 风雨后见彩虹 阅读(1683) 评论(0) 推荐(0) 编辑
如何用JavaScript判断dom是否有存在某class的值？
摘要： 例如： 判断html节点的class是否有no-js。 1.jquery的实现方式 jquery源码的实现方式： 源码里面用到了nodeType，nodeType是HTML DOM 的nodeType 属性，nodeType 属性返回以数字值返回指定节点的节点类型。常用的一般有三种： 例如，获得 b 阅读全文
posted @ 2017-02-13 08:57 风雨后见彩虹 阅读(21473) 评论(0) 推荐(2) 编辑
2017年2月11日
HTML DOM classList 属性
摘要： 页面DOM里的每个节点上都有一个classList对象，程序员可以使用里面的方法新增、删除、修改节点上的CSS类。使用classList，程序员还可以用它来判断某个节点是否被赋予了某个CSS类。 添加类（add） 为 <div> 元素添加多个类: 移除类(remove) 使用remove方法，你可以 阅读全文
posted @ 2017-02-11 21:45 风雨后见彩虹 阅读(4143) 评论(0) 推荐(1) 编辑
2017年2月10日
vuejs自定义过滤器根据搜索框输入的值，筛选复杂的列表数据
摘要： 如题所示，自定义过滤器根据搜索框输入的值，筛选复杂的列表数据。如图所示： html代码： js自定义过滤器代码： 比如在输入框中输入'mm'，得到筛选的结果如图所示： 阅读全文
posted @ 2017-02-10 21:22 风雨后见彩虹 阅读(21595) 评论(0) 推荐(3) 编辑
2017年2月9日
HTML5效果：实现树叶飘落
摘要： 实现如图所示的东西效果（落叶下落）： html代码： css代码： js代码： 转载地址：http://www.html5tricks.com/css3-fall-leaves.html 阅读全文
posted @ 2017-02-09 22:18 风雨后见彩虹 阅读(6330) 评论(1) 推荐(3) 编辑
vuejs通过filterBy,orderBy实现搜索筛选，降序排序数据实例
摘要： 直接贴代码了： 先上输入前的样子： 当在输入框中输入'合同'，得到结果如图: 阅读全文
posted @ 2017-02-09 18:01 风雨后见彩虹 阅读(13263) 评论(0) 推荐(1) 编辑
JS中sort()方法的用法，参数以及排序原理
摘要： sort() 方法用于对数组的元素进行排序,并返回数组。默认排序顺序是根据字符串Unicode码点。语法：arrayObject.sort(sortby)；参数sortby可选。规定排序顺序。必须是函数。注：如果调用该方法时没有使用参数，将按字母顺序对数组中的元素进行排序，说得更精确点，是按照字符编 阅读全文
posted @ 2017-02-09 14:47 风雨后见彩虹 阅读(62110) 评论(0) 推荐(6) 编辑
2017年2月8日
vuejs2.0与1.x版本中怎样使用js实时访问input的值的变化
摘要： vuejs 2.0中js实时监听input 在2.0的版本中，vuejs把v-el 和 v-ref 合并为一个 ref 属性了，可以在组件实例中通过 $refs 来调用。这意味着 v-el:my-element 将写成这样： ref="myElement"， v-ref:my-component 变 阅读全文
posted @ 2017-02-08 21:05 风雨后见彩虹 阅读(9328) 评论(0) 推荐(2) 编辑
2017年2月7日
vuejs-指令详解
摘要： v-if v-if指令可以完全根据表达式的值在DOM中生成或移除一个元素。如果v-if表达式赋值为false，那么对应的元素就会从DOM中移除；否则，对应元素的一个克隆将被重新插入DOM中，代码如下： 由于v-if是一个指令，需要将它添加到一个元素上。但是如果想要切换多个元素，则可以把<templa 阅读全文
posted @ 2017-02-07 13:22 风雨后见彩虹 阅读(24241) 评论(2) 推荐(6) 编辑
2017年2月5日
HTML5为输入框添加语音输入功能
摘要： 这里介绍的是大家以后要用到的html强大功能，可直接给输入框增加语音功能，下面我们先来看看实现方法。 大家可以看到在输入框右边的麦克风图标，点击麦克风就能够进行语音识别了。 其实很简单，语音识别是html5的基本功能，它的用法是 如果喜欢XHTML类似的语法，可以这样表示 语音识别在十年前是让人觉得 阅读全文
posted @ 2017-02-05 08:36 风雨后见彩虹 阅读(14622) 评论(3) 推荐(0) 编辑
2017年2月4日
HTML5 拖放（Drag 和 Drop）详解与实例
摘要： 简介 拖放是一种常见的特性，即抓取对象以后拖到另一个位置。 在 HTML5 中，拖放是标准的一部分，任何元素都能够拖放。 先点击一个小例子：在用户开始拖动 <p> 元素时执行 JavaScript 提示： 链接和图片默认是可拖动的，不需要 draggable 属性。 定义和用法 在拖放的过程中会触发 阅读全文
posted @ 2017-02-04 15:26 风雨后见彩虹 阅读(29594) 评论(6) 推荐(8) 编辑
CSS gradient渐变之webkit核心浏览器下的使用以及实例
摘要： 一、关于渐变 渐变是一种应用于平面的视觉效果，可以从一种颜色逐渐地转变成另外一种颜色，故可以创建类似于彩虹的效果渐变可以应用在任何可以使用图片的地方。例如，您可以指定一个这么一个渐变：顶部的颜色是红色，中间的是蓝色，底部为黄色来作为div的背景色。渐变通过-webkit-gradient方法实现，可 阅读全文
posted @ 2017-02-04 11:42 风雨后见彩虹 阅读(1988) 评论(1) 推荐(0) 编辑
touch.js 拖动、缩放、旋转 （鼠标手势）
摘要： 可以实现手势操作：拖动、缩放、旋转。封装好的脚本方法是这样的： html代码： js调用： 转载地址：http://blog.csdn.net/somethin...touch官网地址：https://www.awesomes.cn/repo/... 阅读全文
posted @ 2017-02-04 11:25 风雨后见彩虹 阅读(13797) 评论(1) 推荐(0) 编辑
HTML5中的input type为file控件限制上传文件类型及扩展
摘要： 简单介绍 input file控件限制上传文件类型如下：1.文件类型中间用，分开；2.html和htm这样的要写成两个； 3实例： 如果想在手机上实现拍照上传，添加如下代码： 重要的就是这句话：capture="camera" accept="image/*" 下面精简代码（备注），On mobil 阅读全文
posted @ 2017-02-04 10:43 风雨后见彩虹 阅读(7081) 评论(0) 推荐(0) 编辑
angluarjs中页面初始化的时候会出现语法{{}}在页面中问题
摘要： angluarjs中页面初始化的时候会出现语法{{}}在页面中问题，也即是页面闪烁问题。出现这个的原因是：由于页面或者组件需要渲染加载数据，浏览器和angluarjs渲染页面需要消耗一定的时间，虽然这个时间很多，可能肉眼看不出来，但有的时候加载时间比较长的时候，特别是网络等原因。这样就看到了在渲染前 阅读全文
posted @ 2017-02-04 09:07 风雨后见彩虹 阅读(814) 评论(0) 推荐(0) 编辑
CSS3属性animation-play-state控制动画运行或暂停的技巧
摘要： animation-play-state介绍 animation-play-state 属性规定动画正在运行还是暂停。 浏览器支持：Internet Explorer 10、Firefox 以及 Opera 支持 animation-play-state 属性。Safari 和 Chrome 支持替 阅读全文
posted @ 2017-02-04 08:52 风雨后见彩虹 阅读(15477) 评论(0) 推荐(2) 编辑
2017年1月20日
Javascript URI 解析介绍
摘要： URI 在维基百科中对于URI的解释是这样子的: 在计算机术语中，统一资源标识符（Uniform Resource Identifier，或URI)是一个用于标识某一互联网资源名称的字符串。 该种标识允许用户对网络中（一般指万维网）的资源通过特定的协议进行交互操作。URI由包括确定语法和相关协议的方 阅读全文
posted @ 2017-01-20 14:22 风雨后见彩虹 阅读(3003) 评论(0) 推荐(2) 编辑
2017年1月19日
vue.js插入dom节点的方式
摘要： html代码： js代码： 说明：1.对比jquery的dom节点的插入方式，vue.js的插值需要使用先new创建一个实例然后通过$mount()。2.手动挂载到dom节点中，然后使用$appendTo/$before/$after等方法进行插值。3.这种操作dom的思想其实并不是vue提倡的方式 阅读全文
posted @ 2017-01-19 14:23 风雨后见彩虹 阅读(45677) 评论(1) 推荐(3) 编辑
2017年1月12日
window.atob()与window.btoa()方法实现编码与解码
摘要： window.atob() 与window.btoa() WindowBase64.atob() 函数用来解码一个已经被base-64编码过的数据。你可以使用 window.btoa() 方法来编码一个可能在传输过程中出现问题的数据，并且在接受数据之后，使用 window.atob() 方法来将数据 阅读全文
posted @ 2017-01-12 22:32 风雨后见彩虹 阅读(15037) 评论(0) 推荐(0) 编辑
使用FileReader接口读取文件内容
摘要： 如果想要读取或浏览文件，则需要通过FileReader接口，该接口不仅可以读取图片文件，还可以读取文本或二进制文件，同时，根据该接口提供的事件与方法，可以动态侦察文件读取时的详细状态，接下来，我们详细介绍FileReader接口的使用方法。 FileReader 接口 FileReader 接口提供 阅读全文
posted @ 2017-01-12 21:58 风雨后见彩虹 阅读(5524) 评论(0) 推荐(0) 编辑
移动前端—H5实现图片先压缩再上传
摘要： 在做移动端图片上传的时候，用户传的都是手机本地图片，而本地图片一般都相对比较大，拿iphone6来说，平时拍很多图片都是一两M的，如果直接这样上传，那图片就太大了，如果用户用的是移动流量，完全把图片上传显然不是一个好办法。 目前来说，HTML5的各种新API都在移动端的webkit上得到了较好的实现 阅读全文
posted @ 2017-01-12 21:33 风雨后见彩虹 阅读(19547) 评论(3) 推荐(3) 编辑
JS单体内置对象之Math常用方法（min，max，ceil，floor，round，random等）
摘要： 1.min()和max()方法 Math.min()用于确定一组数值中的最小值。Math.max()用于确定一组数值中的最大值。 2.舍入方法 Math.ceil()执行向上舍入，即它总是将数值向上舍入为最接近的整数； Math.floor()执行向下舍入，即它总是将数值向下舍入为最接近的整数； M 阅读全文
posted @ 2017-01-12 11:12 风雨后见彩虹 阅读(1392) 评论(0) 推荐(0) 编辑
JS中使用document.defaultView.getComputedStyle()、currentStyle()方法获取CSS属性值
摘要： 在对网页进行调试的过程中，经常会用到js来获取元素的CSS样式，方法有很多很多，现在仅把我经常用的方法总结如： 1. obj.style：这个方法只能JS只能获取写在html标签中的写在style属性中的值（style=”…”），而无法获取定义在<style type="text/css">里面的属 阅读全文
posted @ 2017-01-12 09:27 风雨后见彩虹 阅读(8547) 评论(0) 推荐(3) 编辑
2017年1月11日
JS按位非(~)运算符与~~运算符的理解分析
摘要： 在SF上看到这个问题，js中怎么理解按位取反？ 问题： ~ 运算符查看表达式的二进制表示形式的值，并执行位非运算。Javascript 按位取反运算符 (~) ，对一个表达式执行位非（求非）运算。如 ~1 = -2; ~2 = -3; js取反我只知道个！，但是~为什么也叫取反，他返回的又不是boo 阅读全文
posted @ 2017-01-11 22:26 风雨后见彩虹 阅读(27551) 评论(6) 推荐(7) 编辑
上一页 1 ··· 7 8 9 10 11 12 13 14 15 下一页