gpt4 book ai didi

javascript改变图像

转载 作者:行者123 更新时间:2023-11-28 21:22:42 25 4
gpt4 key购买 nike

您好,我想请求您有关 javascript 代码的帮助,我该如何进行这项工作?

我已将图像保存在 D 盘中。我需要在这里更改一些路径吗:

谢谢

<html>
<head>
<script type="text/javascript">

<!--
var image1=new Image()
image1.src="pic001.png"
var image2=new Image()
image2.src="pic002.png"
var image3=new Image()
image3.src="pic003.png"
//-->
</script>
</head>

<body onLoad="slidit()">
<img src="pic001.png" name="slide" width="400" height="120" />


<script>
<!--
//variable that will increment through the images
var step=1
function slideit(){
//if browser does not support the image object, exit.
if (!document.images)
return
document.images.slide.src=eval("images"+step+".src")
if (step<3)
step++
else
step=1
//call function "slideit()" every 1 seconds
setTimeout("slideit()",1000)
}
slideit()
//-->
</script>

</body>


</html>

最佳答案

I have saved the images in my D drive. Do I need to change some path here

为什么要给出静态/绝对路径?在您的网络应用程序中使用相对路径。如果您只是练习使用单个 HTML,那么只需将所有图像放在 HTML 所在的同一文件夹中即可。

<小时/>

相对路径

它表示图像相对于 HTML 页面所在位置的文件路径。换句话说,您可以以 HTML 页面为起点来确定图像的路径。例如:-

<img src="../images/img.jpg" />

绝对路径

绝对路径与相对路径不同,因为图像文件相对于网页的位置并不重要。这是因为您告诉浏览器该文件在网络上的确切位置。示例:-

<img src=" D/Web/pic001.png" />

参见this以获得更多帮助。

<小时/>

在您的代码中,以下是使用图像路径的代码:

var image1=new Image()
image1.src="pic001.png"
var image2=new Image()
image2.src="pic002.png"
var image3=new Image()
image3.src="pic003.png"
<小时/>

更新:-

因为你的 html 和图像位于同一个文件夹中,所以你应该这样写:

<script type="text/javascript">

<!--
var image1=new Image()
image1.src="pic001.png"
var image2=new Image()
image2.src="pic002.png"
var image3=new Image()
image3.src="pic003.png"
//-->
</script>
<小时/>

我的演示工作代码:

<html>
<head>
<script type="text/javascript">
var image1 = "./images/img02.jpg"
var image2 = "./images/img03.jpg"
var image3 = "./images/img04.jpg"
</script>
</head>
<body onLoad="slidit()">
<form name="images">
<img src="./images/img01.jpg" name="slide" width="200" height="200" />
<script>
//variable that will increment through the images
var step = 1
function slideit(){
//if browser does not support the image object, exit.
switch(step){
case 1:
document.images.slide.src = image1;
break;
case 2:
document.images.slide.src = image2;
break;
case 3:
document.images.slide.src = image3;
break;
}
if (step < 3) {
step++
}
else {
step = 1
}
//call function "slideit()" every 1 seconds
setTimeout("slideit()", 1000)
}

slideit()
</script>
</form>
</body>
</html>

上面是我的演示代码,运行良好。我对您的代码进行了一些更改,它现在将定期更改图像。我希望这就是你想要的。您必须更改代码中使用的图像路径,其他一切都可以并准备就绪。

关于javascript改变图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5855477/

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