Question

Rewriting Javascript code to use 1 function instead of multiple

By Paulg.ie ·
Hello
Apologies i am very new to this. I am looking to rewrite the javascript code below in such a way that i only use 1 function instead of six to modify the font sizes. can anybody help me with that. the code is written in the index.html file

<section id="ingredients" onmouseover="ingredientsHover()" onmouseout="ingredientsNormal()"> </section>

<section id="about" onmouseover="aboutHover()" onmouseout="aboutNormal()"></section>


<section id="preparation" onmouseover="preparationHover()" onmouseout="preparationNormal()"> </section>


<script>

function ingredientsHover(){
document.getElementById('ingredients').firstElementChild.firstElementChild.style.fontSize = "300%"
}

function ingredientsNormal(){
document.getElementById('ingredients').firstElementChild.firstElementChild.style.fontSize = "100%"
}

function preparationHover() {
document.getElementById('preparation').firstElementChild.firstElementChild.style.fontSize = '300%';
}


function preparationNormal() {
document.getElementById('preparation').firstElementChild.firstElementChild.style.fontSize = '100%';}

function aboutHover() {
document.getElementById('about').firstElementChild.firstElementChild.style.fontSize = '300%';
}


function aboutNormal() {
document.getElementById('about').firstElementChild.firstElementChild.style.fontSize = '100%';}

</script>
Thread display: Collapse - | Expand +

All Answers

Share your knowledge

Related Discussions

Related Forums