Функция JavaScript не срабатывает

Question

Я работаю над созданием мобильной страницы, использующей JavaScript, чтобы вывести верхнее меню и закрыть его, но он не работает. Вот JS

<script> 
window.onload = function() { 
var elem = document.getElementById('navBarMobile'); 
var burger = document.getElementById('hamburgerMobile'); 
var cross = document.getElementById('crossMobile'); 
} 

function menuExpand() { 

    elem.style.transition = "height 1s linear 0s"; 
    elem.style.height = "292px"; 

    burger.style.transition = "opacity 0.5s linear 0s"; 
    burger.style.opacity = "0"; 
    burger.style.zIndex = "0"; 

    cross.style.transition = "opacity 0.5s linear 0.5s" 
    cross.style.opacity = "1"; 
    cross.style.zIndex = "1"; 
} 

function menuClose() { 

    elem.style.transition = "height 1s linear 0s"; 
    elem.style.height = "87px"; 

    burger.style.transition = "opacity 0.5s linear 0.5s"; 
    burger.style.opacity = "1"; 
    burger.style.zIndex = "1"; 

    cross.style.transition = "opacity 0.5s linear 0s"; 
    cross.style.opacity = "0"; 
    burger.style.zIndex = "0"; 
} 
</script> 

И HTML

<div id="hamburgerMobile" onclick="menuExpand();"></div> 
<div id="crossMobile" onclick="menuClose();"></div> 

Раньше у меня были заявления декларации видели в верхней части в отведенных местах внутри функции, но каждая функция стреляла только один раз.

Answer 1

Переменные elem, burger и cross определены в разных областях и не видны в ваших функциях.

Вы должны попытаться объявить его раньше:

var elem; 
var burger; 
var cross; 

window.onload = function() { 
    elem = document.getElementById('navBarMobile'); 
    burger = document.getElementById('hamburgerMobile'); 
    cross = document.getElementById('crossMobile'); 
} 

Читайте о функциональных областях: http://www.w3schools.com/js/js_scope.asp