How to interchange two divs. I mean if you want to interchange the two divs in same position after a interval. In my example i have taken two divs with id #div1 and #div2. Both the divs fading in and fading out after a inteval

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
var i=1;
setInterval(function(){
if(i%2==0){
$("#div2").fadeOut();
$("#div1").fadeIn(2000);


}else{

$("#div1").fadeOut(2000);

$("#div2").fadeIn(2000);

}
i++;

}, 5000);

});
</script>
</head>
<body>

<div id="div1" style="width:80px;height:80px;display:none;background-color:red;position:absolute">
One</div>

<div id="div2" style="width:80px;height:80px;display:none;background-color:blue;position:absolute">
Two</div>

</body>
</html>

Leave comment

Your email address will not be published. Required fields are marked with *.