function moveFont(textId,user_x,user_y,user_s,timer){
//兼容性检测
if(!document.getElementById) return false;
if(!document.getElementById(textId)) return false;
let p_font = document.getElementById(textId);
//js防抖
if(p_font.timers){
clearTimeout(p_font.timers);
}
//查询计算样式
function getStyle(elem,prop){
if( window.getComputedStyle ){
return window.getComputedStyle(elem,null)[prop];
}else{
return elem.currentStyle[prop];
}
}
//动画的实现
if(!getStyle(p_font,'left') || !getStyle(p_font,'top')) return false;
let p_x = parseInt(getStyle(p_font,'left')),
p_y = parseInt(getStyle(p_font,'top')),
speed = 0
if(p_x == user_x && p_y == user_y){
return true;
}
if(p_x < user_x){
speed = Math.floor((user_x-p_x)/user_s);
p_x = p_x + speed;
}
if(p_x > user_x){
speed = Math.floor((p_x-user_x)/user_s);
p_x = p_x - speed;
}
if(p_y < user_y){
speed = Math.floor((user_y-p_y)/user_s);
p_y = p_y + speed;
}
if(p_y > user_y){
speed = Math.floor((p_y-user_y)/user_s);
p_y = p_y - speed;
}
p_font.style.left = p_x + 'px';
p_font.style.top = p_y + 'px';
let func = "moveFont('"+textId+"',"+user_x+","+user_y+","+user_s+","+timer+")";
p_font.timers = setTimeout(func,timer);
}
function linkImgShow(){
if(!document.getElementsByTagName) return false;
if(!document.getElementById) return false;
if(!document.getElementById('list')) return false;
if(!document.getElementById('move_img')) return false;
let moveImg = document.getElementById('move_img'),
list = document.getElementById('list'),
a_list = list.getElementsByTagName('a');
a_list[0].onmouseover = function(){
moveFont('move_img',-100,0,10,10);
}
a_list[1].onmouseover = function(){
moveFont('move_img',-200,0,10,10);
}
a_list[2].onmouseover = function(){
moveFont('move_img',-300,0,10,10);
}
}
animation
最新推荐文章于 2024-08-28 14:58:40 发布