Wednesday, August 26, 2015

CSS Tips and Tricks: Make an image appearing as disabled.

At times, in your HTML pages, you would want user to display images as disabled.
For example, consider a Delete button in an HTML table where for a few rows you cannot allow delete operations (based on some criteria). In such cases, it would be a good (and self-explanatory) to display Delete image as disabled (instead of hiding the same). Following is the CSS for the same:

.disabledImage {
    opacity: 0.4;
    filter: alpha(opacity=30); /* msie */
}

Example usage:

<img src="../content/images/delete.png" title="cannot delete this entry due to dependency" class="disabledImage"/>

No comments:

Post a Comment

Thanks for visiting my blog.
However, if this helped you in any way, please take a moment to write a comment.

Thanks
Nirman