StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POUsing CSS, can you apply a gradient mask to fade to the background over text?
primarykey
Id
9525215
data
AcceptedAnswerId
9670876
AnswerCount
4
ClosedDate
CommentCount
2
CommunityOwnedDate
CreationDate
2012-03-01T22:30:14.907
FavoriteCount
6
LastActivityDate
2018-07-27T11:33:33.557
LastEditDate
2018-07-27T11:12:16.160
LastEditorUserId
247696
OwnerUserId
1162844
ParentId
0
PostTypeId
1
Score
33
ViewCount
61638
LastEditorDisplayName
text
Body
I have a full screen fixed background image. I would like the text in my scrolling div to fade out at the top, presumably by applying a gradient mask to the background at only the top part of the div. I'm interested in having the text look like it fades away as it the user scrolls down, but still having a large area of full opacity for actually reading the text. I know there are masking options in the webkit, but I can't find a way to fade through to the page's background over the contained text only applying the gradient to a small portion of the element. Here's an image of the desired result: <a href="https://i.stack.imgur.com/l8awL.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/l8awL.png" alt=""></a>
Tags
<css><gradient><masking>
Title
Using CSS, can you apply a gradient mask to fade to the background over text?
singulars
PostAcceptedAnswerId
1. PO
 singulars
 PostTypePostTypeId
 PTAnswer
PostParentId
1. This table or related slice is empty.
PostTypePostTypeId
1. PTQuestion
UserLastEditorUserId
1. USFlimm
UserOwnerUserId
1. USaviemet
plurals
PostLinksPostIdRelatedPostId
1. PL
 singulars
 LinkTypeLinkTypeId
 LTLinked
PostLinksRelatedPostIdPostId
1. PL
 singulars
 LinkTypeLinkTypeId
 LTLinked
PostsAcceptedAnswerId
1. This table or related slice is empty.
PostsParentIdCreationDate
1. PO
 singulars
 PostTypePostTypeId
 PTAnswer
2. PO
 singulars
 PostTypePostTypeId
 PTAnswer
VotesPostIdCreationDate
1. VO
 singulars
 PostPostId
 POUsing CSS, can you apply a gradient mask to fade to the background over text?
 UserUserId
 This table or related slice is empty.
 VoteTypeVoteTypeId
 VTUpMod
2. VO
 singulars
 PostPostId
 POUsing CSS, can you apply a gradient mask to fade to the background over text?
 UserUserId
 This table or related slice is empty.
 VoteTypeVoteTypeId
 VTUpMod
3. VO
 singulars
 PostPostId
 POUsing CSS, can you apply a gradient mask to fade to the background over text?
 UserUserId
 This table or related slice is empty.
 VoteTypeVoteTypeId
 VTUpMod
CommentsPostId
1. COread this and follow totorial: http://webdesignerwall.com/tutorials/css-gradient-text-effect
 singulars
 PostPostId
 POUsing CSS, can you apply a gradient mask to fade to the background over text?
 UserUserId
 USLuca Filosofi
2. COThanks, I saw that before I posted this, and it would work if I just wanted to fade to white, but I want to fade to the image background of the page.
 singulars
 PostPostId
 POUsing CSS, can you apply a gradient mask to fade to the background over text?
 UserUserId
 USaviemet

Querying!

Guidance

A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.