I'm new to using Jquery and JqueryUI. I have a div named front, which I want to initially display on window load and then hide it by sliding after a delay of 5500 milliseconds. However, I'm encountering errors in the jquery.min.js file.
The HTML code is as follows:
<head>
<style>
#front {
width: 400px;
height: 400px;
display: none;
}
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js">
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
</head>
<body>
<div id="front"> </div>
<script>
function slider() {
$("#front").show("fade",500);
$("#front").delay(5500).hide("slide",{direction:"right"},500);
}
window.onload = function () {
slider();
}
</script>
</body>
</html>
You can view the jsfiddle here. The error message I am receiving is:
Uncaught TypeError: r.easing[this.easing] is not a function
at init.run (jquery.min.js:3) at i (jquery.min.js:3) at Function.r.fx.tick (jquery.min.js:3) at eb (jquery.min.js:3)