Best way to delay function in javascript?

I am trying to find a better way to defer myFunction. As you can see, I animated this image to disappear, and when I click on it, I start a new animation, such as slideleft, and at the end of this animat I call myFunctionContinued is delayed for about 5 seconds until my animat is complete , and the link will not open. I do not think this is a smart way to do this, and I would like your suggestions!

All code here is jsfidle

HTML only div with id and fadein class

<div id="object4" class="fadeIn">
 <a id="myLink" href="#" onclick="myFunction();return false;"><img class="img4" src="http://imageshack.com/a/img89/1871/deqz.png"></a></div>

CSS and fadein and slideleft keyframes

<style> 

body{

background-color:black;

width:800px;
}

img.img4{
width: 300px; height: 200px;
transform:translate(550px,150px);

}

/*
==============================================
fadeIn
==============================================
*/

.fadeIn{
    animation-name: fadeIn;
    -webkit-animation-name: fadeIn; 

    animation-duration: 1.5s;   
    -webkit-animation-duration: 1.5s;

    animation-timing-function: ease-in-out; 
    -webkit-animation-timing-function: ease-in-out;     

    visibility: visible !important; 
}

@keyframes fadeIn {
    0% {
        transform: scale(0);
        opacity: 0.0;       
    }
    60% {
        transform: scale(1.1);  
    }
    80% {
        transform: scale(0.9);
        opacity: 1; 
    }   
    100% {
        transform: scale(1);
        opacity: 1; 
    }       
}



/*
==============================================
slideLeft
==============================================
*/


.slideLeft{
    animation-name: slideLeft;
    -webkit-animation-name: slideLeft;  

    animation-fill-mode: forwards;
    animation-duration: 4s; 
    -webkit-animation-duration: 4s;

    animation-timing-function: ease-in-out; 
    -webkit-animation-timing-function: ease-in-out;     

    visibility: visible !important; 
}

@keyframes slideLeft {
    0% {
        transform: translateX(40%);
    }
    90% {
        transform: translateX(-3%);
    }

    100% {
        transform: rotate(-130deg) translate(-430px,60px);
    }
    /*from {transform: translateX(40%);}
    to {transform: translateX(-3%);}*/
}

</style>

Click on object4 trigger animation slideleft function wait 5 seconds and continue the continue function and open the link in the same window

<script>

function myFunction()
{
$('#object4').click(function() {
        $(this).addClass("slideLeft");


    });

setTimeout(myFunctionContinued, 5000);

}

function myFunctionContinued(){

window.open("http://www.w3schools.com",'_self',false);}

</script>

, , , , .

!