gpt4 book ai didi

javascript - 图像交替功能交替错误的图像

转载 作者:可可西里 更新时间:2023-11-01 13:07:09 25 4
gpt4 key购买 nike

我是 HTML、JavaScript 和 CSS 的新手,正在参加网页设计类(class)。我需要制作一个在两个不同图像 ( banner1.jpg & banner2.jpg ) 之间交替的横幅广告。我遇到的问题是当我的网站加载时显示 banner1.jpg<h2> 之上, 和 court.jpg以下。然后它改变court.jpgbanner2.jpg然后到banner1.jpg , 在两个横幅之间来回交替。 banner1.jpg<h2> 之上保持静止。相关代码如下:

<script type="text/javascript">
/* <![CDATA[ */

var curImage="banner1";
function bannerAd() {
if (curImage == "banner2") {
document.images[1].src = "images/banner1.jpg";
curImage = "banner1";
}
else {
document.images[1].src = "images/banner2.jpg";
curImage = "banner2";
}
}

/* ]]> */
</script>

</head>
<body onload="var changeImages=setInterval('bannerAd()', 2000);">
<header>
<h1>Basketball Almanac</h1>
</header>
<section class="main">
<img src="images/banner1.jpg" alt="Banner image" />
<h2>Basketball Analysis</h2>
<p><span class="companyname">Basketball Almanac</span> is your one-stop site for in-depth basketball analysis and statistics.</p>
<img class="main" src="images/court.jpg" alt="NBA Court" />

我如何才能做到这一点banner1.jpg变化?预先感谢您提供的任何帮助,如果在此处包含更多代码是否有帮助,请告诉我。

最佳答案

很简单,在javascript中,数组是从0开始的,所以第一个对象是[0]

所以你想要

var curImage="banner1";

function bannerAd() {
if (curImage == "banner2") {
document.images[0].src = "images/banner1.jpg";
curImage = "banner1";
}
else {
document.images[0].src = "images/banner2.jpg";
curImage = "banner2";
}
}

或者稍微简化一下

var curImage="images/banner2.jpg";

function bannerAd() {
if (curImage == "images/banner1.jpg") {
curImage= "images/banner2.jpg";
}
else {
curImage = "images/banner1.jpg";
}

document.images[0].src = curImage;
}

关于javascript - 图像交替功能交替错误的图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31259507/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com