Rui Rui - 6 months ago 35
HTML Question

Javascript fadeIn() transition

I have this code that switches the opacity of an image after a certain delay:

$(".pattern-overlay").css("background","black").delay(2000).queue(function() {
$(this).css("background", "rgba(0, 0, 0, 0.4)").dequeue();

How can I make the transition look smooth instead of just switching the colors directly?

Answer Source

Here is a working example with animate():

    opacity: 0.4,
}, 1000);
.pattern-overlay {
    width: 200px;
    height: 200px;
<script src=""></script>
<div class="pattern-overlay"></div>

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download