Javascript幻灯片展示的一点帮助

Javascript slide show a little help

本文关键字：一点 帮助 幻灯片 Javascript      更新时间：2023-09-26

我正在尝试制作幻灯片，我刚刚开始玩制作网站和幻灯片不工作，我不知道为什么。我已经修复了所有的错误，我可以，所以现在我需要一些帮助与这个…

<head>
<title>Alanna's JavaScript slide show</title>
<script language="JavaScript">
var interval = 1500;
var random_display = 0;
var imageDir = "";
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;
    function get_ImageItemLocation(imageObj) {
        return (imageObj.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]);
        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('slideImg1')">
<img name="slideImg1" src="01.jpg" width=500 height=375 border=0>
<img name="slideImg2" src="02.jpg" width=500 height=375 border=0>
<img name="slideImg3" src="03.jpg" width=500 height=375 border=0>
<img name="slideImg4" src="04.jpg" width=500 height=375 border=0>
<img name="slideImg5" src="05.jpg" width=500 height=375 border=0>

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

缺失}

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

试一试这是我猜你想要什么

<head>
<title>Alanna's JavaScript slide show</title>
<script language="JavaScript">
var interval = 1500;
var random_display = 0;
var imageDir = "";
var imageNum = 0;
var imageArray = [];
var place = "slideImg1";
for (var i=0;i<5;i++) {
  imageArray[i] = new imageItem(imageDir + "0"+i+".jpg")
}
var totalImages = imageArray.length;
function imageItem(image_location) { // preloads
    this.image_item = new Image();
    this.image_item.src = image_location;
}    
function get_ImageItemLocation(imageObj) {
    return imageObj.image_item.src;
}
function randNum(x, y) {
    var range = y - x + 1;
    return Math.floor(Math.random() * range) + x;
}
function getNextImage() {
  var imageNum = (random_display)?randNum(0, totalImages-1):(imageNum+1) % totalImages;
  return get_ImageItemLocation(imageArray[imageNum]);
}
function getPrevImage() {
    imageNum = (imageNum-1) % totalImages;
    return get_ImageItemLocation(imageArray[imageNum]);
}
function prevImage() {
    var new_image = getPrevImage();
    document[place].src = new_image;
}
function nextImage() {
    var new_image = getNextImage();
    document[place].src = new_image;
}
window.onload=function() {
  init();
}
function init() {
    nextImage()
    timerID = setInterval(nextImage, interval);
}
</script>
</head>
<body>
<img name="slideImg1" src="01.jpg" width=500 height=375 border=0>
<a href="#" onClick="init()">play slide show</a>
<a href="#" onClick="clearTimeout(timerID)"> pause</a>
<a href="#" onClick="prevImage(); clearTimeout(timerID)">previous</a>
<a href="#" onClick="nextImage(); clearTimeout(timerID)">next </a>
</body>
相关文章：