javascript-新人提问:html怎么让图片滑动起来呢？

问题描述

新人提问:html怎么让图片滑动起来呢？: html怎么让图片滑动起来呢？
假如一个这个图片
就是让图片从左上角，滑到右下角，再往上滑到右上角，再滑到左下角。
没一点思路……
求朋友帮我指点迷津。
新人没分，万分感谢

解决方案

javascript的移动：


function moveDiv(){
    var oDiv = document.getElementById('your_image_id');
    oDiv.style.left = (oDiv.offsetLeft + 1) + 'px';
    oDiv.style.top = (oDiv.offsetTop + 1) + 'px';

    if(oDiv.offsetLeft >= 300 || oDiv.offsetTop >= 300){
        return;
    }

    setTimeout(moveDiv, 10);
};

moveDiv();

解决方案二：

jquery animate

解决方案三：

jquery animate

解决方案四：

position:absolute定位，然后用setInterval或者setTimeout更新style的left和top属性

解决方案五：

假如一个图片，在function中是不是要写var a=document.getId("a")，但是再a.后面，没有left和top之类的属性

解决方案六：

用jquery 不过对应的图片要设置Position属性为相对定位

解决方案七：

接楼上，设置image的position为absolute

$('your image').css('position', 'absolute').animate({left: 300, top: 300}, 1000);

解决方案八：

参考这改一下就好了
<!DOCTYPE html>

Insert title here
$(function(){
moveDiv();
});
function moveDiv(){
$("#moveDiv").animate({"left":"1000px","top":"700px"},4000,function(){
$("#moveDiv").animate({"left":"1000px","top":"0px"},4000,function(){
$("#moveDiv").animate({"left":"0px","top":"700px"},4000,function(){
$("#moveDiv").animate({"left":"0px","top":"0px"},4000,function(){
moveDiv();
});
});
});
});
}

解决方案九：

参考这改一下就好了
<!DOCTYPE html>