JavaScript资料,JavaScript文章,JavaScript文档-易库教程

bootstrap配合Masonry插件实现瀑布式布局

2017年02月06日 99 阅读

问题是这样的，使用bootstrap的栅格进行布局的时候，如果大小超过了，会自动的转到下一行，但是在显示图片的时候就会出现缝隙，下面介绍masonry进行缝隙的填补。好，下面上货。1、首先是html<html> <head><title>Title</title><meta charset="utf-8"/><link rel="stylesheet" type="text/css" hre...

详解微信小程序开发之——wx.showToast（OBJECT）的使用

2017年02月06日 131 阅读

wx.showToast API是显示消息提示框的作用。先让我们看一下官方的文档说明：注意：其中的图标，只支持”success”、”loading”示例代码：wx.showToast（{ title: "成功", icon: "success", duration: 2000}）接下来演示如何使用，先打开微信web开发者工具，新建快速项目，删除掉首页没用的内容，保留如下部分。添加两个按钮，同事添加点击事件。再在按钮上添加navigator导航，链接到...

微信小程序的动画效果详解

2017年02月06日 103 阅读

前言由于公司计划有变，所以从H5页面改成去小程序写。所以在着手开发小程序。本人也不是什么前端高手，只是一名写后端偶尔写写前端的渣渣。请前端大神们勿喷。一、什么是微信小程序？小程序在我的理解中只是高度封装的H5，封装了各种组件。根据官方的说法小程序运行不是在浏览器当中。姑且算是微信的插件吧。二、小程序不能操纵DOM 小程序不能直接操纵DOM，鼓励的是数据绑定。例如vue.js这种。所以个人而言感觉跟如果习惯了用JQ去操纵DOM的开发者很不习惯。需要一个...

利用Vue.js实现checkbox的全选反选效果

2017年02月06日 90 阅读

前言这篇文章主要是跟大家分享了利用Vue.js实现checkbox的全选反选效果，之前写的代码存在一个bug,就是当你选择全选的时候去掉后面的一个选项，再点全选结果就是反的了。后来很感谢朋友留言帮我改了这个问题嘻嘻,下面一起来看看具体是怎么实现的吧.html示例代码<template> <div> <input type="checkbox" class="input-checkbox" v-model="checked" v...

js实现消息滚动效果

2017年02月06日 99 阅读

今天教大家做个消息滚动的小功能。实现的很简单。自己都有点意想不到呢~ 哈哈1.实现的中心思想，如图所示：2.图片移动，用的是appendTo（）这个方法。这个方法是先将标签从父标签中删除，然后拼接到某个标签后面，所以也就是替我们实现了，remove（）这个方法。所以用这个方法是极好的~3.然后就会用到定时器了。用定时器每次调用移动方法，让<ul>每次执行一个动画，改变它的margin-top值，执行完动画后，再将它的margin-top变为初始...

jQuery Masonry瀑布流插件使用方法详解

2017年02月06日 144 阅读

用jQuery Masonry 插件创建瀑布流式的页面我们可以使用 jQuery 的 Masonry 插件来实现这种页面形式，下面介绍一下方法。1、分别下载 jQuery 与 Masonry ，然后把他们都加载到页面中使用。加载代码：<script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script><script src="http://jq22.q...

AngularJs 利用百度地图API 定位当前位置获取地址信息

2017年02月06日 122 阅读

第一、申请百度密钥很简单的几步就搞定第二、引入文件<！-- 百度地图定位 --><script src="http://api.map.baidu.com/components?ak=WUfZTjKPuZ2G5RmgD0Psejv6XOmIEQVQ"></script> <script type="text/javascript" src="http://api.map.baidu.com/api?...

EasyUI修改DateBox和DateTimeBox的默认日期格式示例

2017年02月06日 147 阅读

最近整理Easyui控件的时候，对Easyui的DateBox控件和DateTimeBox控件进行了梳理，而我之所以将EasyUI的DateBox控件和DateTimeBox控件放在一起，归为一类，是因为这两个控件没有什么区别，如果你非得说这两个控件有区别，也无非是DateTimeBox控件后面除了基本的年月日之外带上了小时或者分钟或者秒什么的，更何况，这两个控件在进行日期格式化时所采用的方法也是一样的。DateBox介绍：Demo实例参看：http://...

js实现简单的网页换肤效果

2017年02月06日 92 阅读

中心思想：网页换肤的原理就是通过调用不同的样式表文件来实现不同的皮肤切换，并且需要将换好的皮肤计入Cookie中，这样用户已下次访问时，就可以显示用户自定义皮肤了步骤：1.在设计HTML代码时，用了一些小技巧，就是将皮肤选择按钮<li>元素的id与网页皮肤的样式文件名称设置的相同。这样就可以使完成换肤操作简化很多。2.HTML结构要有一个带id的样式表链接，通过操作该链接的herf属性的值，从而实现换肤<link rel="stylesh...

原生js实现中奖信息无间隙滚动效果

2017年02月06日 118 阅读

知识要点1.实现原理：通过定时器不断改变列表的top值。而达到无间隙滚动就要对信息列表复制一份，再判断两个列表的top临界值初始化。最后注意的就是防止动画积存需要对定时器进行清除。2.用到的属性方法：setInterval（） //每隔一定时间执行一次函数，可以无限执行下去clearInterval（） //清除指定的setIntervalsetTimeout（） //经过一定时间执行一次函数，只能执行一次，如果要无限下去需要在函数里自行设置clearT...

详解jquery validate实现表单验证（正则表达式）

2017年02月06日 180 阅读

一、目的为了更好地实现人机交互，使用jQuery封装库中的validate插件，在用户填写表单时，可以快速地对用户填写的数据进行验证，并做出反馈。二、validate插件简介validate（）是插件的核心方法，定义了基本的校验规则和一些有用的配置项。rule:设置表单的验证规则；messages:设置表单不符合验证规则的提示信息；debug:如果这个参数为true,那么表单还会提交，只进行检查，调试时十分方便。required:必填minlength:最...

原生js实现返回顶部缓冲效果

2017年02月06日 94 阅读

运行原理通过定时器30毫秒执行一次滚动条上升，每次上升的高度为当前高度的80%，这样就达到了上升缓冲的动画效果。判断当滚动条高度超过一屏时，按钮显示，默认隐藏知识要点scrollTop//获取滚动条高度需要写兼容clientHeight//可视窗口高度需要写兼容setInterval//定时器window.onscroll//滚动触发事件完整代码<！DOCTYPE html><html lang="en"><head>...

原生js实现节日时间倒计时功能

2017年02月06日 97 阅读

知识要点1.实现原理：用结束时间-当前时间=时间差当前时间每过1秒时间差自然也就少了1秒所以要1秒更新一次当前时间就达到了倒计时的效果2.需要注意的就是时间之间的转换和对得出数值的处理3.用到的方法：obj.getTime（） //换算成毫秒Math.floor（） //把小数点向下舍入结果取一个整数50%24 // 这是对数值求余的方法，意思是假如有50个小时，一天24个小时这个得出的结果就是余数是2具体的数值的运算处理完整代码里有详细的注释完整代...

基于JavaScript实现窗口拖动效果

2017年02月06日 92 阅读

写法类似于上一篇，水平进度条拖拽，具体内容如下<！DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><style>*{margin: 0;padding: 0;}.nav{width: 100%;height: 20px;background-color: #ccc...

原生js获取浏览器窗口及元素宽高常用方法集合

2017年02月06日 156 阅读

窗口可视区域宽度： document.documentElement.clientWidth || document.body.clientWidth;窗口可视区域高度： document.documentElement.clientHeight || document.body.clientHeight;窗口可视区域宽度+边线和滚动条： document.body.offsetWidth ;窗口可视区域高度+边线和滚动条： document.body.o...

JavaScript实现水平进度条拖拽效果

2017年02月06日 80 阅读

本文实例为大家分享水平进度条拖拽效果的js具体代码，供大家参考，具体内容如下<html><head><meta charset="UTF-8"><title>Document</title><style>*{margin: 0;padding: 0;}.scroll{margin:100px;width: 500px;height: 5px;background: #ccc;posit...

JavaScript实现垂直滚动条效果

2017年02月06日 95 阅读

本文实例为大家分享了js垂直滚动条的实现代码，供大家参考，具体内容如下1、红色盒子高度计算公式：容器的高度 / 内容的高度 * 容器的高度2、红色方块移动一像素，我们的内容盒子移动多少呢？（内容盒子高度 - 大盒子高度） / （大盒子高度 - 红色盒子的高度）计算倍数（内容盒子高度 - 大盒子高度）/ （大盒子高度 - 红色盒子的高度） * 红色盒子移动的数值<html><head><meta charset="UTF-...

javascript中json基础知识详解

2017年02月06日 103 阅读

大致介绍JSON（JavaScript Object Notation JavaScript对象表示法）,JSON是一种数据格式，不是一种编程语言。虽然它的名字中有JavaScript但是它却不属于JavaScript,就像Java和JavaScript的关系一样。而且，并不是只有JavaScript才使用它,毕竟 JSON 只是一种数据格式。很多编程语言都有针对 JSON 的解析器和序列化器。JSON是由Douglas Crockford在2001年提出...

EasyUi 打开对话框后控件赋值及赋值后不显示的问题解决办法

2017年02月06日 136 阅读

1：首先赋值要在页面加载后才能赋值，也就是在onLoad中；2：是因为dialog里的输入域用了textbox控件,如果需要赋值,那么要调用textbox的赋值方法,而不是$（"#userName"）.val（row[0].User_name）;因为easyui的textbox控件,初始化之后,会将原输入域隐藏起来,而控件实际展示的,是easyui所生成的输入域.可以使用浏览器查看控件初始化之后的dom结构就知道了.所以将赋值语句修改为$（"#dilog_...

JS生成一维码（条形码）功能示例

2017年02月06日 161 阅读

本文实例讲述了JS生成一维码（条形码）功能的方法。分享给大家供大家参考，具体如下：1、js代码：（function（） { if （！exports） var exports = window; var BARS= [212222,222122,222221,121223,121322,131222,122213,122312,132212,221213,221312,231212,112232,122132,122231,113222,123122,12...

首页 / 脚本样式 / JavaScript

bootstrap配合Masonry插件实现瀑布式布局

详解微信小程序开发之——wx.showToast（OBJECT）的使用

微信小程序的动画效果详解

利用Vue.js实现checkbox的全选反选效果

js实现消息滚动效果

jQuery Masonry瀑布流插件使用方法详解

AngularJs 利用百度地图API 定位当前位置 获取地址信息

EasyUI修改DateBox和DateTimeBox的默认日期格式示例

js实现简单的网页换肤效果

原生js实现中奖信息无间隙滚动效果

详解jquery validate实现表单验证 （正则表达式）

原生js实现返回顶部缓冲效果

原生js实现节日时间倒计时功能

基于JavaScript实现窗口拖动效果

原生js获取浏览器窗口及元素宽高常用方法集合

JavaScript实现水平进度条拖拽效果

JavaScript实现垂直滚动条效果

javascript中json基础知识详解

EasyUi 打开对话框后控件赋值及赋值后不显示的问题解决办法

JS生成一维码（条形码）功能示例

AngularJs 利用百度地图API 定位当前位置获取地址信息

详解jquery validate实现表单验证（正则表达式）