Question

I have a button in my index.php that shows a menu and hides the content of the page. However it’s suppose to work for two different templates. My function basically looks like this :

function show_menu();
{
document.getElementById('menu').style.display="block";
document.getElementById('content1').style.display="none";
document.getElementById('content2').style.display="none";
}

If I only put one of the content, hide it works. However if I put both contents it doesn’t. What’s going on? Is that impossible or am I doing something wrong?

Answer 1

I am not sure if I got your issue correctly, but if I do, the problem is, that you cannot set the style of elements that do not exist on your page. You have to check for null values:

function show_menu()
{
document.getElementById('menu').style.display="block";

var content1 = document.getElementById('content1'),
    content2 = document.getElementById('content2');

if (content1) {
    content1.style.display="none";
}
if (content2) {
    content2.style.display="none";
}
}