对于javaScript的一些封装,希望能对大家有帮助
//运动透明封装
function move(obj,json,fn){ // 属性值可以不加px 透明度是用0-1之间的数值
clearInterval(obj.timer) //清除正在执行的定时器
var iSpeed = 0;
obj.timer = setInterval(function(){
var bOver = true; //假设运动完成
for (var attr in json){ //每个属性的遍历修改
var iCur = 0;
var iTarget; // 因为我们传入的透明度参数是0-1之间,而我们的初始值是乘100的,所以目标值应该也相应的乘100
if(attr == "opacity"){ //透明度
iCur = parseFloat(getStyle(obj,"opacity"))*100;
iTarget = parseInt(json[attr]*100);
}else{
iCur = parseInt(getStyle(obj,attr));
iTarget = parseInt(json[attr]);
}
iSpeed = (iTarget - iCur)/5;//获取相对速度
iSpeed = iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed);//上下取整
if(iCur != iTarget){
bOver = false; //如果某一个属性没有完成运动
if(attr == "opacity"){
obj.style.filter ='alpha(opacity:'+(iCur + iSpeed)+')';
obj.style.opacity =(iCur + iSpeed)/100;
}else{
obj.style[attr] =iCur + iSpeed +"px";
}
}
}
if(bOver){//运动完成
clearInterval(obj.timer);
if(fn){
fn(); //如果有回调函数,执行回调函数
}
}
},30)
}
//拖拽的封装
function dragEle(obj,obj2){
var flag = 0;
var _left,_top;
// 鼠标按下
obj.onmousedown = function(e){
var evt = eevent;
flag = 1;
_left = evt.offsetXlayerX;
_top = evt.offsetYlayerY;
}
// 鼠标松开
document.onmouseup = function(){
flag = 0;
}
// 鼠标移动
document.onmousemove = function(e){
var evt = eevent;
if(flag){
obj2.style.left = evt.clientX-_left+"px";
obj2.style.top = evt.clientY-_top+"px";
}
}
}
//获取ajax封装
function ajax(url,bb){
//创建
var xhr = new XMLHttpRequest();
//建立连接
xhr.open('get',url,true);
//发送
xhr.send();
//返回数据
xhr.onreadystatechange = function(){
if(xhr.readyState==4&xhr.status==200){
var res = xhr.responseText;
bb(res);
}
}
}
//获取style样式封装
function getStyle(obj,attr){
if(obj.currentStyle){
return obj.currentStyle[attr];
else{
return window.getComputedStyle(obj,null)[attr];
}
}
//兼容版获取Class封装
function getClass(classname,obj){
var arr = [];
if(document.getElementsByClassName){
return document.getElementsByClassName("classname");
}else{
var all = document.getElementsByTagName("*");
for(var i=0;i<all.length;i++){
var myClass = all[i].className.split(/\s+/);
for(var j=0;j<myClass.length;j++){
if(myClass[j]==classname){
arr.push(all[i]);
}
}
}
return arr;
}
}
共同学习,写下你的评论
评论加载中...
作者其他优质文章