Javascript-moving image

它是如何将一幅图像从一个位置移动到另一个位置的？我甲肝这样的功能Javascript-moving image

隐蔽：

function SetOpacity(object,opacityPct) 
{ 
    // IE. 
    object.style.filter = 'alpha(opacity=' + opacityPct + ')'; 
    // Old mozilla and firefox 
    object.style.MozOpacity = opacityPct/100; 
    // Everything else. 
    object.style.opacity = opacityPct/100; 
} 
function ChangeOpacity(id,msDuration,msStart,fromO,toO) 
{ 
    var element=document.getElementById(id); 
    var opacity = element.style.opacity * 100; 
    var msNow = (new Date()).getTime(); 
    opacity = fromO + (toO - fromO) * (msNow - msStart)/msDuration; 
    if (opacity<0) 
    SetOpacity(element,0) 
    else if (opacity>100) 
    SetOpacity(element,100) 
    else 
    { 
    SetOpacity(element,opacity); 
    element.timer = window.setTimeout("ChangeOpacity('" + id + "'," + msDuration + "," + msStart + "," + fromO + "," + toO + ")",1); 
    } 
} 

function FadeOut(id) 
{ 
    var element=document.getElementById(id); 
    if (element.timer) window.clearTimeout(element.timer); 
    var startMS = (new Date()).getTime(); 
    element.timer = window.setTimeout("ChangeOpacity('" + id + "',500," + startMS + ",100,0)",1); 
}

用于获取当前位置或下一个位置（由图像的ID和DIV的ID）

function findPos(e){ 
var obj = document.getElementById(e); 
var posX = obj.offsetLeft;var posY = obj.offsetTop; 
while(obj.offsetParent){ 
posX=posX+obj.offsetParent.offsetLeft; 
posY=posY+obj.offsetParent.offsetTop; 
if(obj==document.getElementsByTagName('body')[0]){break} 
else{obj=obj.offsetParent;} 
} 
alert(posX+'-'+posY); 
}

所述第一位置是图像的位置，然后 - 是div的位置

来源

2010-11-02 Andriy K.

最简单的方法是使用jQuery并使用动画函数mate。

例：

$(".block").animate({"left": "+=50px"}, "slow");

如你所愿动态变化的数值您可以使用像背景颜色，透明度等方面的括号多个参数。

一个供大家参考链接位于：

来源

2010-11-02 23:07:22 ninu

大多数JavaScript动画依靠计时器创建流体运动的影响。要在整个页面上滑动图片，您需要设置一个时间间隔，以便每5毫秒将css位置更改为右侧1px或类似的东西。 Javascript animation tutorial.

但是，动画最容易用像jquery这样的库完成或者many others.

来源

2010-11-02 23:11:43

Javascript-moving image

回答

相关问题