Edit in JSFiddle

var enlace = document.getElementById("enlace"),
    fondo = document.getElementById("fondo"),
    contenido = document.getElementById("contenido"),
    si = document.getElementById("si"),
    no = document.getElementById("no"),
    body = document.body,
    width = window.innerWidth,
    height = window.innerHeight,
    widthCont = 400,
    heightCont = 240,
    cerrar = function(){
        var hF = height, hC = heightCont,
            intervaloF = setInterval(function(){          
                if (hF > 0)
                    fondo.style.height = (hF -= 10) + "px";                    
                if (hF <= 0){
                    clearInterval(intervaloF);
                    fondo.style.display = "none";
                    body.style.overflow = "auto";
                }
            }, 1),
            intervaloC = setInterval(function(){            
                if (hC > 0)
                    contenido.style.height = (hC -= 5) + "px";          
          
                if (hC <= 0){
                    clearInterval(intervaloC);
                    contenido.style.display = "none";
                }
            }, 1);
        };

fondo.style.width = width + "px";
contenido.style.width = widthCont + "px";

enlace.addEventListener("click", function(event){
    event.preventDefault();
  
    fondo.style.display = "block";
    contenido.style.display = "block";
    
    contenido.style.top = ((height / 2) - (heightCont / 2) + window.scrollY) + "px";
    contenido.style.left = ((width / 2) - (widthCont / 2) + window.scrollX) + "px";
    
    var hF = 0, hC = 0,
        intervaloF = setInterval(function(){          
            if (hF <= height)
                fondo.style.height = (hF += 10) + "px";          
          
            if (hF >= height)
                clearInterval(intervaloF);
        }, 1),
        intervaloC = setInterval(function(){
            if (hC <= heightCont)
                contenido.style.height = (hC += 5) + "px";      
          
            if (hC == heightCont)
                clearInterval(intervaloC);
        }, 1);
  
    body.style.overflow = "hidden";    
}, false);

si.addEventListener("click", function(){
    alert("Se está eliminando el dato"); //Solo para el ejemplo
    window.location = enlace.href;
    cerrar(); //Solo para el ejemplo
}, false);
fondo.addEventListener("click", cerrar, false);
no.addEventListener("click", cerrar, false);

<div id = "fondo"></div>
<div id = "contenido">
    ¿Realmente deseas eliminar este dato?
    <div>
        <label id = "si">Sí</label>
        <label id = "no">No</label>
    </div>
</div>
<a id = "enlace" href = "http://www.google.com">Enlace</a>

body{
    margin: 0;
}

#fondo, #contenido{
    display: none;
    position: absolute;
    z-index: 1000;
}

#fondo{
    background: rgba(0, 0, 0, .75);
    top: 0;
    left: 0;
}

#contenido{
    background: white;
    border-radius: .5em;
    overflow: auto;
    /* OPCIONAL */
    text-align: center;
    line-height: 12.5em;
    font-weight: bolder;
}

#contenido div{
    margin-top: -10em;
}

#contenido div label{
    padding: .5em 1em;
    color: white;
    text-align: center;
    border-radius: .5em;
    cursor: pointer;
    transition: .5s;
}

#contenido div label:hover{
    background: steelblue;
}

#si{
    background: green;
}

#no{
    background: red;
}