Skip to content
Advertisement

change footer size by id

I am trying to run a function that changes the margin-top size according to what is being displayed. However, it doesn’t seem to be working?

<body onload="changeFooter()">

<script>

const heading = document.getElementById('verify'); 
const footer = document.getElementById('footer')


function changeFooter () {
   if (heading == true){
       footer.style.marginTop = "200px"
   }
}

also tried this

function changeFooter () {
   if (heading.match('Verify')){
       footer.style.marginTop = "200px"
   }
}



</script>


 <h1 id="verify" class="verifyheading">Verify Identity</h1>

Thank you

Advertisement

Answer

document.getElementById returns the element (if it exists) or null, not a boolean (true/false).

You can simply do if(heading) { ... } as your condition.

Here’s a snippet based on your code: https://codepen.io/29b6/pen/XWZVqWx

Advertisement