项目背景图片轮播是前端项目必有项，当前有很多效果很酷炫的轮播插件，例如Swiper。但是当项目中的图片轮播只需要一个很简单的轮播样式，比如这样的我们引用这样一个110k的大插件，就大材小用了。再安利一下，swiper2.x和swiper3.x对移动和PC端支持情况如下图当当当当~~~我们今天的主角登场了，thebird/Swipe，这个插件完成了图片轮播需要的基本功能，只有14.2k,真真的轻量级 啊。还有，还有翻译一下，就是俺们全支持，不管你是PC端...
最近公司给公司里架设了私有的npm仓库，相应地也需要一个用来发布react组件用的脚手架，在这个过程中又又又又复习了一下webpack，在这里分享下脚手架搭建的过程。 首先，我们预期的脚手架具有如下功能 开发组件时可以实时预览对组件各种资源进行打包(js/css/图片等)一键打包发布1.创建项目脚手架的名字暂时取react-simple-component-boilerplate。 首先创建一个新目录用于放我们的文件: mkdir react-simple-component-boilerplate ...
本文实例讲述了jquery.cookie.js实现用户登录保存密码功能的方法。分享给大家供大家参考，具体如下： 需要导入的js有jquery.js和jquery.cookie.js <script type="text/javascript" src=" jquery-1.5.2.js"></script> <script type="text/javascript" src="jquery.cookie.js"></script>在页面加载时首先尝试获取cookie的值，如果cookie有值，则将获取到的值填入输入框中，并将保存密码的复选框选中 jQuery(function(){//获取cookie的...
1、jquery.autocomplete参考地址 http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/ http://docs.jquery.com/Plugins/Autocomplete 2、jquery.autocomplete详解 语法： autocomplete(urlor data, [options] ) 参数： url or data：数组或者url [options]：可选项，选项解释如下： 1) minChars (Number) 在触发autoComplete前用户至少需要输入的字符数，Default:1，如果设为0，在输入框内双击或者删除输入框内内容...
本文实例讲述了jQuery实现的指纹扫描效果。分享给大家供大家参考，具体如下： 运行效果截图如下：点击此处查看在线演示效果。 具体代码如下： <!DOCTYPE html> <html><head><meta charset="UTF-8" /><title>demo</title><style type="text/css">body {background:black;}.dialog {width:300px; height:300px; position:fixed; left:50%; margin-left:-150px; border:2px dashed green;top:50px;}.dialog .shape {background:black;...
代码如下:<a class="jq_btn" href="#"><div></div></a> //鼠标移上去效果 $(".jq_btn").hover(function(){ $(this).find("div").stop().fadeIn(); },function(){ $(this).find("div").stop().fadeOut(); }); 原理很简单 a标签背景设置正常状态 div背景设置鼠标hover的背景 只要给元素加上 代码如下:class="jq_btn" 都自动有效果
今天我为大家讲解一个页面开发过程中的一个小技巧：如何处理裂图 也就是说如果这个图片没有加载成功了会怎么办？ 第一步：HTML页面里： 代码如下:<!DOCTYPE html> <html> <head> <title>gbin1</title> <meta charset=utf-8 /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"> </script> </head> <body> <img src="broken.jpg"/> </body> </html> 运行这个页面大家会看到一个坏掉的图。 第二部：...
Promise对象是CommonJS工作组为异步编程提供的统一接口，是ECMAScript6中提供了对Promise的原生支持，Promise就是在未来发生的事情，使用Promise可以避免回调函数的层层嵌套，还提供了规范更加容易的对异步操作进行控制。提供了reject,resolve,then和catch等方法。 使用PROMISE Promise是ES6之后原生的对象，我们只需要实例化Promise对象就可以直接使用。 实例化Promise: var promise = new Promise(function (resolve, reject) {c...
我想熟悉javascript的没有不知道jquery的吧,作为首屈一指的javascript框架,他的许多特性都让人兴奋不已,其中不得不提的就是特有的连缀书写语法了,那他到底只怎么实现的呢,我们也来实现一个吧. 代码如下: sx.$=function(id){ var t=(typeof(id)=="string"?document.getElementById(id):id); t.text=function(){ return this.innerText?this.innerText:this.innerHTML.replace(//<.*?/>/igm,""); } t.html=function(){ return this....
在C#里，定义多维数组，可以通过这样简单的代码实现： 代码如下:int[,]myArray=new int[4,5]; 在JavaScript中不能通过直接定义实现多维数组，那么该怎么实现呢？首先定义一维数组: 代码如下:var myArray=new Array(); 然后再将一维数组的成员定义成数组（之所以可以进行再定义，因为JavaScript是弱类型）： 代码如下:myArray[0]=new Array(); 到此为止，就定义了一个第一个索引为0的二维数组，如果想使用第一个索引为1的二维数组，...
众所周知，浏览器自带的原生弹窗很不美观，而且功能比较单一，绝大部分时候我们都会按照设计图自定义弹窗或者直接使用注入layer的弹窗等等。前段时间在 慕课网 上看到了一个自定义弹窗的实现，自己顺便就学习尝试写了下，下面是主要的实现代码并添加了比较详细的注释，分享出来供大家参考。（代码用了ES6部分写法如需兼容低版本浏览器请把相关代码转成es5写法,后面有时间更新为一个兼容性较好的es5版本） HTML部分：（没什么内容 放...
我们上网经常会遇到第一次需要登录而之后不用再登录的网站的情况，其实是运用了Cookie 存储 web 页面的用户信息，Cookie 以名/值对形式存储,当浏览器从服务器上请求 web 页面时， 属于该页面的 cookie 会被添加到该请求中我们上网经常会遇到第一次需要登录而之后不用再登录的网站的情况，其实是运用了Cookie 存储 web 页面的用户信息，Cookie 以名/值对形式存储,当浏览器从服务器上请求 web 页面时， 属于该页面的 cookie 会被添加...
之前项目需求需要写一个纯js文本比较工具，在此小编把代码分享在脚本之家平台供大家参考，算法有待优化，本文写的不好还请见谅。先上效果图:代码如下所示： 把源码保存为html格式的文件就可以直接运行了<!doctype html> <html> <head> <title>文本比较工具</title> <style type="text/css"> *{padding:px;margin:px;} html,body{ overflow-y: hidden; } .edit_div{ border: px solid #CCCCCC; overflow: auto; position: relative;...
方法一： 代码如下:function checkRe(checkid) { var id = window.parent.getQry("ctrid") + "_"; var values = window.parent.opener.document.getElementById(id + "txt_dept_name").value; var keys = window.parent.opener.document.getElementById(id + "hf_ids").value; var ary = checkid.value.split("|"); var newsValues = ary[0]; var newsKeys = ary[1]; if (checkid.checked) { values = values + "," + newsValues; ...
本文实例为大家分享了layui实现三级导航菜单的具体代码，供大家参考，具体内容如下 <!DOCTYPE html> <html> <head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"><title>.Net海</title><link href="~/layui-v2.2.5/layui-v2.2.5/layui/css/layui.css" rel="stylesheet" /> //注意路劲<style>ol li a {background-color: rgba(0,0,0,1) !important;}.three_this {b...