2016-06-21 9 views
0

Я не могу получить изображение на переключатель вперед и назад между «скрытым» и «шоу»изображения не будет переключаться между скрытым и показать

Я использую идеи How to create a hidden <img> in JavaScript?

У меня есть два различные кнопки, пытаясь его с помощью HTML, а другой использовать JavaScript - Если я закомментировать одну строку, свет фото лампочка отображается

//document.getElementById("light").style.visibility = "hidden"; 

Эта строка кода находится в моей «инициализации» Функция

Если я не комментирую линии, свет остается «скрытый», независимо от того, какая из кнопок я нажимаю

Я не вижу каких-либо ошибок в веб-консоли Вход Сафари

<!DOCTYPE html> 
<html> 
<body> 

<h1>Switch on the Light</h1> 

<img id="light" src="WebVuCoolOldBulb-2.jpg" style="width:100px" > 

<button type = button 

onclick="document.getElementById('light').src.show ='WebVuCoolOldBulb-2.jpg'" >Switch On the Light 

</button> 
    <input type="button" id="onButton" value="ON" /> 

</body> 

<script> 

//document.images['light'].style.visibility = hidden; 

    function init() { 
    //document.getElementById("light").style.visibility = "hidden"; 
    var onButton = document.getElementById("onButton"); 
    onButton.onclick = function() { 
     demoVisibility() ; 

    } 
    } 

function demoVisibility() { 
    document.getElementById("light").style.visibility = "show"; 

} 
    document.addEventListener('readystatechange', function() { 
    // Seems like a GOOD PRACTICE - keeps me from getting type error I was getting 

    // https://stackoverflow.com/questions/14207922/javascript-error-null-is-not-an-object 

    if (document.readyState === "complete") { 
     init(); 
    } 
    }); 



</script> 
</html> 

ответ

1

visibility свойство стиля имеет значения visible и hidden.

Нет show значение.

function init() { 
    document.getElementById("light").style.visibility = "hidden"; 
    var onButton = document.getElementById("onButton"); 
    onButton.onclick = function() { 
     demoVisibility(); 
    } 
    } 

function demoVisibility() { 
    document.getElementById("light").style.visibility = "visible"; 
} 

 Смежные вопросы

  • Нет связанных вопросов^_^