function getStyle(obj,attr)
{
return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr];
}
运动函数
//封装运动函数
//既然是运动函数就需要传递几个条件(参数)
// 1.对象(你得知道让谁动吧)
// 2.方向(你得告诉他朝哪边走吧)
// 3.速度 (你得告诉他一次走多少吧)
// 4.终点(你得告诉他什么时候停止吧)
// 5.回调函数(到达终点以后干点什么吧)
function Imove(obj,attr,step,target,endfn)
{
//防止累加,越来越快。这样一上来我都从0开始计算
clearTimeout(obj.timer);
//主要是判断速度是正的还是负的,上来先比较。我的思路是要是目标的位置比初始的位置大,则速度肯定是正的,要是小则速度肯定是负的
step = target>parseInt(getStyle(obj,attr))? step:-step;
obj.timer = setInterval(function(){
var dis = parseInt(getStyle(obj,attr))+step; //获取到每次走了之后距离最开始的位置
//判断一下当走的距离要是超过了终点,则必须拉回来。要是没超过。则继续走.
if(dis>=target&&step>0||dis<target&&step<0)
{
dis = target;
}
obj.style[attr] = dis+"px"; //给这个对象赋值,让他自己慢慢走。
if(dis==target) //当到达了终点了,就不让他走了。这个时候你需要清除定时器了。因为没用了。
{
clearInterval(obj.timer); //清除定时器
endfn&&endfn(); //执行回调方法
}
},100)
}
//封装运动函数结束
抖动函数封装
function shake(obj,attr,endfn) {
var arr = [];
for (var i = 20; i > 0; i -= 2)
{
arr.push(i,-i);
}
arr.push(0);
clearInterval(obj.shaker);
var index = 0 ;
obj.shaker = setInterval(function(){
var speed = (parseInt(getStyle(obj,attr))+arr[index]);
obj.style[attr] = speed +"px";
++index;
if(index==arr.length)
{
clearInterval(obj.shaker);
endfn&&endfn();
}
},10)
}
function doopacity(obj,step,target,endfn)
{
var first = getStyle(obj,"opacity")*100; //获取到滤镜的初始值
step = target>first?step:-step; //一步走的距离是正的是负的
clearInterval(obj.opacity); //一上来清除定时器。防止累加
obj.opacity = setInterval(function(){
var speed = getStyle(obj,"opacity")*100+step; //改变opacity
if(speed>=target&&step>0&&speed<=target&&step<0)
{
speed = target; //变成目标值
}
if(speed==target)
{
clearInterval(obj.opacity); //要是相当则清空
endfn&&endfn(); //执行回调函数
}
obj.style["opacity"] = speed/100; //DIV滤镜效果
obj.style.filter = 'alpha(opacity:' + speed + ')'; //为了兼容性
},100)
}
/*添加类*/
function addClassName(obj,className2)
{
if(obj.className=="")
{
obj.className="on";
}else
{
var Name = obj.getAttribute("class");
var arr = Name.split(" ");
var flag = false; //开关
for(var i=0;i<arr.length;i++)
{
if(arr[i]==className2) //当数组里面这个元素要是找到了证明他的存在,所以就没必要添加了
{
flag = true;
}
}
if(!flag) //表示全部都没找到
{
obj.className +=" "+className2;
}
}
}
/*添加类结束*/
/*移除class类名*/
function removeClassName(obj,className2)
{
if(obj.className!="")
{
var string = obj.className; //获取到类名
var arr = string.split(" "); //切割成数组
var arrnew = [] ; //新的数组用来存储
for(var i=0;i<arr.length;i++)
{
if(arr[i] != className2)
{
arrnew.push(arr[i]);
}
}
obj.className = arrnew.join(" ");
}
}
/*移除class类名方法*/
/*
鼠标滚轮事件
*/
mousewheel(document.getElementById("div1"),function(){console.log("向下滚")},function(){console.log("向上滚")});
function mousewheel(obj,downfn,upfn)
{
obj.onmousewheel = fn;
if (obj.addEventListener) {
obj.addEventListener('DOMMouseScroll', fn, false);
}
function fn(ev) {
var ev = ev || event;
var b = true;
if (ev.wheelDelta) {
b = ev.wheelDelta > 0 ? true : false;
} else {
b = ev.detail < 0 ? true : false;
}
if(b) {
upfn&&upfn();
} else {
downfn&&downfn();
}
if (ev.preventDefault) {
ev.preventDefault();
}
return false;
}
}
function getCookie(key){
var arr1 = document.cookie.split("; "); //必须有空格
console.log(arr1);
for(var i =0;i<arr1.length;i++)
{
var arr2 = arr1[i].split("=");
if(arr2[0]==key)
{
return decodeURI(arr2[1]);
}
}
}
function setCookie(key,value,t){
var oDate = new Date();
oDate.setDate(oDate.getDate()+t);
document.cookie = key+"="+value+' ;expires='+oDate.toGMTString();
// document.cookie = key+"="+value+' ;expires='+oDate.toGMTString()+";path=/";
}
function deleteCookie(key){
setCookie(key," ",-1)
}