---

Search posts under jQuery:

---

.fadeTo() - Adjust opacity of element in jQuery

How to adjust the opacity of a html element in jQuery?

To adjust the opacity of the html element, fadeTo() method can be used.

  <input type="button" id="btnFadeTo" value="Fade To" />

<div id="divFadeTo" style="height: 50px; width: 50px; background: 
    red; left: 0px; display: none; position: absolute;"> </div>

<script>
$("#btnFadeTo").click(function () {
    $("#divFadeTo").fadeTo("slow", "0.20");
});
</script>

In the above code snippet, when button “btnFadeTo” is clicked the opacity of the “divFadeTo” will be set to .20 ie. 20% opaque and 80% transparent.