本文介绍了数组中的替换图像输入的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Lesson 7 Assignment 3</title>
<style>
div.Main {
height: 500px;
width: 800px;
border: 1px solid black;
background-image: url("Apples.jpg");
background-repeat: no repeat;
}
div.Side {
height: 390px;
width: 100px;
border: 1px solid black;
background-color: lightgrey;
opacity: 0.6;
}
div:hover {
background-color: grey;
}
</style>
</head>
<body>
<div style="removed:relative;removed10px;border: 1px solid black;width: 504px;height:390px;">
<div class="Side"> <img src="leftarrow.png" style="width:110px;position:absolute;top:150px;"> </div>
<div class="Side"> <img src="rightarrow.png" style="width:110px;position:absolute;top:135px;left:-10px;"> </div>
<body onload="nextImg(0)">
<img name="PICS">
</div>
<br>
File Name: <input id="myVal" style="width:100px;text-align:left;" type="text">
<button onclick="replaceWord()">Replace</button>
<button onclick="myAdd()">Add Image</button>
<button onclick="myDelete()">Remove</button>
<button onclick="mySort()">Sort</button>
<script>
var currImg=0;
var images = ["bananas.jpg","oranges.jpg","apples.jpg","grapes.jpg"];
document.getElementById("demo").innerHTML = images;
function nextImg(step)
{
currImg += step;
if(currImg >= 0)
{
document.images['PICS'].src = images[currImg];
var nextImg=currImg + 1;
}
else
{
currImg=images.length-1;
}
}
function myAdd(){
images.push("butterfly.jpg");
document.getElementById("demo").innerHTML = images;
}
function myDelete(){
images.pop();
document.getElementById("demo").innerHTML = images;}
function mySort(){
images.sort();
document.getElementById("demo").innerHTML = images;}
function replaceWord() {
}
</script>
</body>
</html>
我尝试了什么:
一切都像问朋友一样他们不知道
What I have tried:
everything like asking friends they just don't know
推荐答案
这篇关于数组中的替换图像输入的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!