This question has already been answered:

Hello guru, help. JS do not know at all :) But you need! so property style.opacity = '1'; added after a second / two. After the click, everything is done, and the buttons of the prev and next appear after a second

function hideSlider () { var featureBlock = document.getElementById('featured'); var prev = document.getElementById('prevlink'); var next = document.getElementById('nextlink') var hideButton = document.getElementById('hideSlide'); if (featureBlock.style.height == '0px' || featureBlock.style.display == "none") { sessionStorage.setItem("isHidden", false); prev.style.height = '40px'; next.style.height = '40px'; prev.style.opacity = '1'; next.style.opacity = '1'; featureBlock.style.height = '300px'; document.getElementById('hide').style.opacity = '1'; document.getElementById('show').style.opacity = '0'; hideButton.style.backgroundImage=""; featureBlock.style.display = "block"; } else { sessionStorage.setItem("isHidden", true); featureBlock.style.height = '0px'; prev.style.height = '0px'; next.style.height = '0px'; prev.style.opacity = '0'; next.style.opacity = '0'; document.getElementById('hide').style.opacity = '0'; document.getElementById('show').style.opacity = '1'; hideButton.style.backgroundImage=""; } }

Reported as a duplicate by participants ߊߚߤߘ , Pavel Mayorov , br3t , Qwertiy ♦ javascript Oct 27 '17 at 23:08 .

A similar question was asked earlier and an answer has already been received. If the answers provided are not exhaustive, please ask a new question .

1 answer 1

setTimeout helped, thanks!

 function hideSlider () { var featureBlock = document.getElementById('featured'); var prev = document.getElementById('prevlink'); var next = document.getElementById('nextlink') var hideButton = document.getElementById('hideSlide'); if (featureBlock.style.height == '0px' || featureBlock.style.display == "none") { sessionStorage.setItem("isHidden", false); prev.style.height = '25px'; next.style.height = '25px'; function opac() { prev.style.opacity = '1'; next.style.opacity = '1'; } setTimeout(opac, 1500); featureBlock.style.height = '300px'; document.getElementById('hide').style.opacity = '1'; document.getElementById('show').style.opacity = '0'; hideButton.style.backgroundImage=""; featureBlock.style.display = "block"; } else { sessionStorage.setItem("isHidden", true); featureBlock.style.height = '0px'; prev.style.height = '0px'; next.style.height = '0px'; prev.style.opacity = '0'; next.style.opacity = '0'; document.getElementById('hide').style.opacity = '0'; document.getElementById('show').style.opacity = '1'; hideButton.style.backgroundImage=""; }

}