Since a couple of weeks ago, answers that are shown grayed out can be un-faded by hovering the mouse over them. This is great especially for users with poor eyesight, who can now read such answers much easier if they want to.
However, hovering works very poorly (if at all) on touch devices, and keeping the cursor constantly hovering over the answer can sometimes be inconvenient on traditional desktops too.
A simple improvement would be to let clicking (or tapping) on the answer body toggle the fading behavior. I'm requesting that this feature be implemented.
One way to do this would be to use the following JS and CSS code (from my answer to the earlier feature-req):
$('#answers').on( 'click', '.answer.downvoted-answer .post-text', function () {
$(this).closest('.answer').toggleClass('clicked');
} );
.downvoted-answer.clicked .post-text,
.downvoted-answer.clicked .post-signature,
.downvoted-answer.clicked .comments,
.downvoted-answer.clicked .vote > * { opacity: 1 }
Update: Actually, it turns out that the code above doesn't work properly on all SE sites, since a few sites (like RPG.SE) still have oddball styling that doesn't use opacity for downvoted posts. (This might be considered a bug, or at least a design wart, in itself.) Anyway, the code that I've added as a client-side workaround into SOUP v1.32 looks like this:
$('#answers').on( 'click', '.answer.downvoted-answer .post-text', function () {
$(this).closest('.answer').addClass('downvoted-answer-clicked').removeClass('downvoted-answer');
} ).on( 'click', '.answer.downvoted-answer-clicked .post-text', function () {
$(this).closest('.answer').addClass('downvoted-answer').removeClass('downvoted-answer-clicked');
} );
Yeah, this is kind of ugly, but it ensures that the code works regardless of how downvoted answers are styled on any particular SE site.
