Modales Pop-up beim Öffnen einblenden und beim Schließen ausblenden

Ich habe einmal eine ziemlich einfache Frage. Ich habe Löschschaltflächen, die modale Popups öffnen, um das Löschen zu bestätigen oder abzulehnen. Ich möchte, dass diese modalen Popups beim Klicken eingeblendet und beim Abbrechen ausgeblendet werden. Ich habe schon ein paar verschiedene Dinge ausprobiert, bisher kein Glück. Ich brauche nur eine einfache Lösung. Danke im Voraus. Hier ist mein Code

<style>
div.delModal
{   
    position:absolute;
    border:solid 1px black;
    padding:8px;
    background-color:white;
    width:160px;
    text-align:right
}
</style>
<script>
function showModal(id) {
        document.getElementById(id).style.display = 'block';
        //$(this).fadeIn('slow');
    }
    function hideModal(id) {
        document.getElementById(id).style.display = 'none';
    }

</script>
</head>

<body>
<input type ="button" value="delete" onclick="showModal('delAll1')">

<div class="delModal" style="display:none" id="delAll1">
  <img src="images/warning.png" />&nbsp;Are you sure you want to delete vessel and the corresponding tanks?<br />
    <input type="button" value="Cancel" class="hide" onclick="hideModal('delAll1')"/>     
    <input type="button" value="Delete" onclick="delVesselAll(1)" id="delete"/>
</div>
</body>

Antworten auf die Frage(4)

Ihre Antwort auf die Frage