理解難度幻燈片腳本

我從網上拍攝了幻燈片放映腳本。但是有一些功能我不明白這裏是腳本理解難度幻燈片腳本

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
    "http://www.w3.org/TR/html4/strict.dtd" 
    > 
<html lang="en"> 
<head> 
    <title></title> 
    <script> 
    var interval = 1500; 

var random_display = 0; 

var imageDir = "my_images/"; 

    var imageNum = 0; 

    imageArray = new Array(); 

    imageArray[imageNum++] = new imageItem(imageDir + "01.jpg"); 
    imageArray[imageNum++] = new imageItem(imageDir + "02.jpg"); 

    imageArray[imageNum++] = new imageItem(imageDir + "03.jpg"); 

    imageArray[imageNum++] = new imageItem(imageDir + "04.jpg"); 

    imageArray[imageNum++] = new imageItem(imageDir + "05.jpg"); 

    var totalImages = imageArray.length; 
    function imageItem(image_location) { 

     this.image_item = new Image(); 

     this.image_item.src = image_location; 
       return this.image_item.src; 
    } 

    function get_ImageItemLocation(imageObj) { 

     return(imageObj.image_item.src) 

    } 


      alert(imageArray[imageNum].image_item.src); 

function randNum(x, y) { 

     var range = y - x + 1; 

return Math.floor(Math.random() * range) + x; 

    } 
function getNextImage() { 

     if (random_display) { 

      imageNum = randNum(0, totalImages-1); 

     } 

     else { 

      imageNum = (imageNum+1) % totalImages; 

     } 

var new_image = get_ImageItemLocation(imageArray[imageNum]); 
//alert(new_image) 
    return(new_image); 

    } 
function getPrevImage() { 

     imageNum = (imageNum-1) % totalImages; 

     var new_image = get_ImageItemLocation(imageArray[imageNum]); 

     return(new_image); 

    } 
function prevImage(place) { 

     var new_image = getPrevImage(); 

     document[place].src = new_image; 

    } 
function switchImage(place) { 

     var new_image = getNextImage(); 

     document[place].src = new_image; 

     var recur_call = "switchImage('"+place+"')"; 

     timerID = setTimeout(recur_call, interval); 

     } 


    </script> 
</head> 
<body onLoad="switchImage('slideImg')"> 
    <img name="slideImg" src="27.jpg" width=500 height=375 border=0> 

<a href="#" onClick="switchImage('slideImg')">play slide show</a> 
<a href="#" onClick="clearTimeout(timerID)"> pause</a> 
<a href="#" onClick="prevImage('slideImg'); clearTimeout(timerID)"> previous</a> 

<a href="#" onClick="switchImage('slideImg'); clearTimeout(timerID)">next </a> 


</body> 
</html>

這裏正是我不知道是什麼acctually做的

get_ImageItemLocation(imageObj)

和

imageItem(image_location)

什麼seperately做這兩個函數的功能？在此先感謝您的關注

來源

2011-11-28 Naeem Ul Wahhab

這是一些*真*冗餘的代碼。 – Blender

@Blender我同意。 –

好的我想通了。我的代碼有很多錯誤。

imageItem是一個構造函數，用於預加載圖像。它返回它預先加載的圖像的src（位置）。

但是函數get_ImageItemLocation()假定imageItem已經返回了一個對象。

整個事情應該簡化爲：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
    "http://www.w3.org/TR/html4/strict.dtd" 
    > 
<html lang="en"> 
<head> 
<title></title> 
<script> 
var interval = 1500; 
var random_display = 0; 
var imageDir = "my_images/"; 
var imageNum = -1; 
var place;//For convenience this is best as a global 
function imageItem(url) { 
    this.img = new Image(); 
    this.img.src = url; 
    this.url = url; 
} 
var imageArray = [ 
    new imageItem(imageDir + "01.jpg"), 
    new imageItem(imageDir + "02.jpg"), 
    new imageItem(imageDir + "03.jpg"), 
    new imageItem(imageDir + "04.jpg"), 
    new imageItem(imageDir + "05.jpg") 
]; 
function randNum(x, y) { 
    var range = y - x + 1; 
    return Math.floor(Math.random() * range) + x; 
} 
function getNextImage() { 
    imageNum = (random_display) ? randNum(0, imageArray.length-1) : ((imageNum+1) % imageArray.length); 
    return imageArray[imageNum]; 
} 
function getPrevImage() { 
// imageNum = (imageNum-1) % imageArray.length;//This is not correct 
    imageNum = (imageNum-1 >= 0) ? (imageNum-1) : (imageArray.length-1); 
    return imageArray[imageNum]; 
} 
function prevImage() { 
    var image_item = getPrevImage(); 
    place.src = place.alt = image_item.url; 
} 
function nextImage() { 
    var image_item = getNextImage(); 
    place.src = place.alt = image_item.url; 
} 
function play() { 
    nextImage(); 
    timerID = setTimeout(play, interval); 
} 
window.onload = function(){ 
    place = document['slideImg']; 
    play(); 
}; 
</script> 
</head> 

<body> 

<img name="slideImg" src="27.jpg" width="500" height="375" border="0"><br /> 
<a href="#" onclick="play()">Play slide show</a>&nbsp;|&nbsp; 
<a href="#" onclick="clearTimeout(timerID)">Pause</a>&nbsp;|&nbsp; 
<a href="#" onclick="clearTimeout(timerID); prevImage();">Previous</a>&nbsp;|&nbsp; 
<a href="#" onclick="clearTimeout(timerID); nextImage();">Next</a> &nbsp; 

</body> 
</html>

那麼如果你想imageArray是圖像的URL，那麼最簡單的方法是數組：...

function imageItem(url) { 
    var img = new Image(); 
    img.src = url; 
    return url; 
} 
for(var i=0; i<5; i++){ 
    imageArray[i] = imageItem(imageDir + i + ".jpg"); 
}

注意如何imageItem在這種情況下不需要new。希望你現在能理解它。讓我知道如果你有這個代碼進一步的問題。

來源

2011-11-28 17:47:47

謝謝你soooooooo多。我想我現在明白了。 –

不用客氣。 –

起初，我很喜歡O_o，但後來我愛上了。 –

理解難度幻燈片腳本

回答

相關問題