0
Это мой первый пост, поэтому, пожалуйста, будьте любезны, если я делаю что-то не так, и спасибо за вашу помощь!Как заполнить массив изображениями?
Я чувствую, что прочитал все учебники и вопросы, но все еще не могу получить этот массив, заполняющий изображения.
Я понял! Спасибо тем, кто помог.
var titleOptions = ["<image src='images/spelling/cat.png' class='cardimg'>", "<image src='images/spelling/bee.png' class='cardimg'>", "<image src='images/spelling/dog.png' class='cardimg'>", "<image src='images/spelling/house.png' class='cardimg'>", "<image src='images/spelling/car.png' class='cardimg'>"];
var descriptionOptions = ["cat", "bee", "dog", "house", "car"];
function firstCard() {
var title = document.getElementById("title");
var description = document.getElementById("description");
document.getElementById("title").innerHTML = titleOptions[0];
document.getElementById("description").innerHTML = descriptionOptions[0];
description.style.display = "none";
if(title.style.display == "none") {
title.style.display = "block";
}
if (titleOptions <= 0) {
document.getElementById("completed").style.visibility = "visible";
document.getElementById("title").style.visibility = "hidden";
}
else {
document.getElementById("completed").style.visibility = "hidden";
document.getElementById("title").style.visibility = "visible";
}
}
function showFront() {
var title = document.getElementById("title");
var description = document.getElementById("description");
description.style.display = "none";
if(title.style.display == "none") {
title.style.display = "block";
}
else {
title.style.display = "block";
}
}
function showBack() {
var title = document.getElementById("title");
var description = document.getElementById("description");
title.style.display = "none";
if(description.style.display == "none") {
description.style.display = "block";
}
else {
description.style.display = "block";
}
if (descriptionOptions <= 0) {
document.getElementById("completed").style.visibility = "visible";
document.getElementById("description").style.visibility = "hidden";
}
else {
document.getElementById("completed").style.visibility = "hidden";
document.getElementById("description").style.visibility = "visible";
}
}
function changeTitle() {
titleOptions.shift();
descriptionOptions.shift();
var title = document.getElementById("title");
var description = document.getElementById("description");
document.getElementById("title").innerHTML = titleOptions[0];
document.getElementById("description").innerHTML = descriptionOptions[0];
description.style.display = "none";
if(title.style.display == "none") {
title.style.display = "block";
}
if (titleOptions <= 0) {
document.getElementById("completed").style.visibility = "visible";
document.getElementById("title").style.visibility = "hidden";
}
else {
document.getElementById("completed").style.visibility = "hidden";
document.getElementById("title").style.visibility = "visible";
}
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Mrs. Katie's Grade One Online Classroom - Spelling</title>
<link rel="stylesheet" type="text/css" href="css/reset.css">
<link rel="stylesheet" type="text/css" href="css/styles.css">
<script src="js/functions.js"></script>
</head>
<body onload="firstCard()">
<header>
<div id="headerwrapper">
<img src="images/mrskatie.png" alt="Mrs. Katie" id="mrskatie">
<h1>Mrs. Katie's</h1>
<h2>Grade One Online Classroom</h2>
</div>
</header>
<div id="bodywrapper">
<nav>
<div class="rectangle">
<ul id="navigation">
<li><a href="spelling.html" class="currentpage">Spelling</a></li>
</ul>
</div>
<div id="trianglecontainer">
<div class="left-triangle-top"></div>
<div class="left-triangle-bottom"></div>
<div class="right-triangle-top"></div>
<div class="right-triangle-bottom"></div>
</div>
</nav>
<div id="card">
<div id="buttonwrapper">
<button onclick="showFront();">Front</button>
<button onclick="showBack();">Back</button>
<button onclick="changeTitle()" id="nextcard">Next</button>
</div>
<div id="textwrapper">
<div id="title" style="display:block;"></div>
<div id="description" style="display:none;"></div>
<div id="completed"><img src="images/popupteacher.png" alt="You completed the cards! Great job." id="popupteacher">
<a href="index.html" id="startover">Start Over</a><a href="#" id="nextsubject">Next Subject</a></div>
</div>
</div>
</div>
</body>
</html>
Что не работает? – epascarello
Что делает ваш код, это не то, что вы ожидаете? Просто подбрасывать такой код там не помогает. У нас нет времени, чтобы пройти через все это и понять это. – krillgar