This Angular tutorial helps you get started with Angular quickly and effectively through many practical examples.

jQuery FadeTo

jQuery fadeTo() Method

The jQuery fadeTo() method allows fading to a given opacity (value between 0 and 1).



  1. speed -It specifies the speed of the fadeTo effect. Default value is 400 milliseconds. Possible values:

    • milliseconds
    • slow
    • fast
  2. opacity - specifies fading to a given opacity (value between 0 and 1).
  3. callback - A function to be executed after the fading method is completed.

The following example demonstrates the fadeTo() method with different parameters.


<!DOCTYPE html>
<script src=""></script>
$("#box1").fadeTo("slow", 0.12);
$("#box2").fadeTo("slow", 0.2);
$("#box3").fadeTo("slow", 0.07);

<button>Click to fade To boxes button</button><br><br>

<div id="box1" style="width:80px;height:80px;background-color:red;"></div><br>
<div id="box2" style="width:80px;height:80px;background-color:green;"></div><br>
<div id="box3" style="width:80px;height:80px;background-color:blue;"></div>


jquery fadeTo method

Now click on button you will see the box opacity.

jquery fadeTo method
Prev Next