Have you tried altering the background color of the Body instead or maybe try setting the z-index to a negative value for the div?
-----Original Message----- From: css-d-boun...@lists.css-discuss.org [mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Chris Hardie Sent: Friday, October 08, 2010 1:08 PM To: css-d@lists.css-discuss.org Subject: [css-d] Overlay you can click through Hi, I fear I have an impossible problem, but I thought I would throw it out there. I am working on a site for dyslexics. Some dyslexics find it easier to read print if they place a red or green plastic overlay over the page (it apparently stops the letters from 'moving'). I developed a small Javascript widget that, when clicked, puts a similar overlay over a webpage. It does it by appending a <div> to the <body> element, expanding it to 100% width and height, and then applying a semi-transparent PNG as a background image. Sample code below: <body> <p>this is my content! <a href="index.html">This is a link!</a></p> <div id="overlay" style="position:absolute;top:0;left:0;width:100%;height:100%;background-imag e:url(overlay.png);" /> </body> This works as I intended, except of course I didn't think that div#overlay would prevent the user from interacting with the page. In the example above, the user is unable to click through the div to reach the link. Can anyone think about how to get the result I want? Thanks! Chris ______________________________________________________________________ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ ______________________________________________________________________ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
