Fading specific CSS/JS Popup when opening/closing

Fading specific CSS/JS Popup when opening/closing

The following code snippet shows how I made popups with CSS and JS. Is
there any chance to let it fade when opening/closing it, without changing
the way I used to work, I mean just popping up the box by changing its
display style?
function lightbox_open(){
window.scrollTo(100,500);
document.getElementById('light').style.display='block';
document.getElementById('fade').style.display='block';
}
function lightbox_close(){
document.getElementById('light').style.display='none';
document.getElementById('fade').style.display='none';
}