Мне нужно, чтобы на моей странице отображался определенный текст, когда пользователь наводит курсор на определенное изображение, и этот текст отличается от каждого изображения. Это код для головы:
<head>
<title>Indian Spices Page</title>
<link rel="stylesheet" type="text/css" href="..\CSS\cookingStyles.css">
<script>
function displayChilli() {
document.getElementById("chilli").style.display = "block";
document.getElementById("cumin").style.display = "none";
document.getElementById("cinnamon").style.display = "none";
document.getElementById("cloves").style.display = "none";
document.getElementById("fenugreek").style.display = "none";
document.getElementById("cardamom").style.display = "none";
document.getElementById("mustard").style.display = "none";
document.getElementById("nutmeg").style.display = "none";
}
function displayCumin() {
document.getElementById("chilli").style.display = "none";
document.getElementById("cumin").style.display = "block";
document.getElementById("cinnamon").style.display = "none";
document.getElementById("cloves").style.display = "none";
document.getElementById("fenugreek").style.display = "none";
document.getElementById("cardamom").style.display = "none";
document.getElementById("mustard").style.display = "none";
document.getElementById("nutmeg").style.display = "none";
}
function displayCinnamon() {
document.getElementById("chilli").style.display = "none";
document.getElementById("cumin").style.display = "none";
document.getElementById("cinnamon").style.display = "block";
document.getElementById("cloves").style.display = "none";
document.getElementById("fenugreek").style.display = "none";
document.getElementById("cardamom").style.display = "none";
document.getElementById("mustard").style.display = "none";
document.getElementById("nutmeg").style.display = "none";
}
</script>
</head>
Это код для активации функций:
<div>
<img class="Spices" src="../Images/chilliPowder.jpg" onMouseOver="displayChilli()">
<img class="Spices" src="../Images/cumin.jpg" onMouseOver="displayCumin()">
<img class="Spices" src="../Images/cinnamon.jpg" onMouseOver="displayCinnamon()">
<img class="Spices" src="../Images/cloves.jpg">
<img class="Spices" src="../Images/fenugreek.jpg">
<img class="Spices" src="../Images/cardamom.jpg">
<img class="Spices" src="../Images/mustardSeeds.jpg">
<img class="Spices" src="../Images/nutmeg.jpg">
</div>
<section id="chlli" style="display:block">
<h2>Chili Powder</h2>
<p>
<b>History</b>
<br> Chili peppers originated in Mexico. Following the Columbian Exchange, many cultivars of chili pepper spread across the world.
</p>
<p>
<b>Uses</b>
<br> Chili peppers are widely used in many cuisines to add spiciness to dishes. The substances that give chili peppers their intensity when ingested or applied topically are capsaicin and related compounds known as capsaicinoids.
</p>
</section>
<section id="cumin" style="display:none">
<h2>Cumin</h2>
<p>
<b>History</b>
<br> Thought to originate around the Eastern Mediterranean, cumin has been in use as a spice for thousands of years with seeds excavated at archaeological sites dated to the second millennium BC.
</p>
<p>
<b>Uses</b>
<br> Cumin can be used ground or as whole seeds. It has an earthy, warming and aromatic character making it a staple in stews, soups and spiced gravies such as curry and chili. It is also used as an ingredient in some pickles.
</p>
</section>
<section id="cinnamon" style="display:none">
<h2>Cinnamon</h2>
<p>
<b>History</b>
<br> Cinnamon was imported to Egypt as early as 2000 BC. It was so highly prized among ancient nations that it was regarded as a gift fit for monarchs. Although its source was kept a closely guarded secret in the Mediterranean world for centuries,
by those in the spice trade to protect their monopoly as suppliers, cinnamon is native to India, Sri Lanka, Bangladesh, and Myanmar.
</p>
<p>
<b>Uses</b>
<br> Cinnamon is used mainly as an aromatic condiment and flavouring additive in a wide variety of cuisines, sweet and savoury dishes.
</p>
</section>
Я работаю на примере передо мной, который структурно не отличается от моего кода. Что с ним не так?