Skip to content

Instantly share code, notes, and snippets.

View wplnancy's full-sized avatar

wplnancy wplnancy

View GitHub Profile
@wplnancy
wplnancy / index.html
Last active December 19, 2016 08:20
jq版伸缩导航
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
html,body, div, ul, li, h2 {
margin: 0;
padding: 0;
font-size: 12px;
@wplnancy
wplnancy / index.html
Created December 19, 2016 07:54
折叠菜单jq版本
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
html,body, div, ul, li, h2 {
margin: 0;
padding: 0;
font-size: 12px;
@wplnancy
wplnancy / index.html
Created December 19, 2016 07:32
鼠标移入图片的淡入淡出
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
html, body, div, ul, li {
margin: 0;
padding: 0;
}
@wplnancy
wplnancy / index.html
Created December 19, 2016 07:21
模拟百度搜素框的效果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>搜索框</title>
<style>
html, body, input, div, ul, li {
margin: 0;
padding: 0;
}
@wplnancy
wplnancy / index.html
Created December 19, 2016 07:19
银行卡号实现每四位数字有一个空格
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body><input type="text" name="name" placeholder="请输入姓名" id="username">
<script charset="utf-8" type="text/javascript">
var username = document.getElementById("username");
@wplnancy
wplnancy / event.html
Last active December 25, 2016 05:07
事件绑定的兼容性处理
//处理ie6~8中DOM2事件绑定兼容性的问题 addEvent实现事件的兼容性的处理
function on(ele, type, handler) {
if (ele.addEventListener) {
ele.addEventListener(type, handler, false);//此时不考虑捕获
return;
}
//for ie 6-8
if (!ele['zw' + type]) {
@wplnancy
wplnancy / index.html
Created December 19, 2016 07:02
拖拽的深入
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
body, html, div, img {
margin: 0;
padding: 0;
}
@wplnancy
wplnancy / index.html
Last active December 19, 2016 07:17
放大镜
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
html, body {
margin: 0;
padding: 0;
}
@wplnancy
wplnancy / animate_easy.js
Created December 15, 2016 06:21
封装animate的动画库
/**
* Created by Administrator on 2016/12/7.
*
*
* 1、 t b c d 准备
* 2、 根据target 来给change 和begin 添加属性
* 3、 清除定时器(上一次的)
* 4、 情定定时器
* time+=10;
* 到达终点的时候判断
@wplnancy
wplnancy / utils
Created December 15, 2016 06:18
封装的dom库(工具包)
/**
* Created by Administrator on 2016/12/4.
*/
var utils = (function () {
function listToArray(likeAry) {
try {
return Array.prototype.slice.call(likeAry, 0);
} catch (e) {
var newArr = [];
for (var i = 0; i < likeAry.length; i++) {