2014-02-06 17 views
0

我有開始在點擊按鈕,滑塊,我想每一個圖像在200 px一個偏移與前一個相比被加載。下面是代碼:使用JavaScript中OFFSETX和的offsetTop或位置x和當前位置ÿ

var image1 = new Image() 
image1.src = "img0.jpg" 
var image2 = new Image() 
image2.src = "img1.jpg" 
var image3 = new Image() 
image3.src = "img2.jpg" 
var image4 = new Image() 
image4.src = "img3.jpg" 
var image5 = new Image() 
image5.src = "img4.jpg" 

var step = 1 

function slideit() { 
    document.images.slide.src = eval("image" + step + ".src") 
    if (step < 5) 
     step++ 

    else 
     step = 1 
    setTimeout("slideit()", 500) 

} 
<button onclick="slideit()">Try it</button> 
<img src="img0.jpg" name="slide" width="100" height="100" position = "absolute"> 

我想這樣做是的JavaScript,因爲我不希望使用jQuery的我的代碼。

+1

您好,歡迎_StackOverflow_。至於你的問題,請檢查你的'_Script_裏面'

0

嘿,這應該爲你工作。我沒有時間檢查它,所以我希望它沒有錯誤。 只需更新JS,即可離開html。

問候

var images = [ 
    'image1.jpg', 
    'Image2.jpg', 
    '...' 
]; 

function slideit() 
{ 
    var index = 0; 
    var container = document.getElementById('yourContainer'); 

    var addPic = function() 
    { 
     var img = document.createElement('img'); 
     img.src = images[index]; 
     img.style.position = 'absolute'; 
     img.style.left = index * 200 + 'px'; 

     container.appendChild(img); 
     index++; 
    } 


    setInterval(addPic, 1000); 
}