文本和活动链接的渐变
我将固定位置的白色到透明的 PNG 放在窗口顶部的文本上，效果很好：当我滚动页面时，文本平滑地消失。问题是：我无法单击位于我的渐变下的链接。我明白为什么会发生这种情况，并且我明白将图像放在文本上方的明显解决方案不适合我。
是否还有其他解决方案可以将渐变图像放在文本上并在该图像下建立链接以保持活动状态。
谢谢。
I put fixed position white-to-transparent PNG over my text on the top of window and it works fine: when I am scroling my page text smothly dissapear. The problem is: I cant click on links that are situated under my gradient. I understand WHY it happend, and I understand that my obvious solution with putting image above text isn't do for me.
Is there are another solutions to put gradient image over text and make links under this image to stay active.
Thanks.
example: http://jsfiddle.net/fl00r/sBy6G/10/
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
您可以使用
pointer-events: none;但是，较旧的浏览器不支持此方法。https://developer.mozilla.org/en/CSS/pointer-events
除此之外，我所能建议的就是走 JS 路线并附加点击事件。
You can use
pointer-events: none;however, older browsers will not support this method.https://developer.mozilla.org/en/CSS/pointer-events
Other than that all I can suggest is going down the JS route and attaching click events.
您可以为渐变
div设置z-index，如下所示：z-index: -1;，您仍然会获得相同的效果你想要的并且它下面的链接（实际上文本和链接将在它上面，因为第二个divz-index自动设置为 0）将起作用。这是我的更改的链接 http://jsfiddle.net/sBy6G/8/
You can set the
z-indexfor the gradientdivas follows:z-index: -1;and you will still have the same effect you want and the links under it (actually the text and the links will be above it because the seconddivz-indexis automatically set to 0) will work.here is a link to my changes http://jsfiddle.net/sBy6G/8/