How do I create the effect where white color text pops up when I hover cursor over a black & white image. And at the same time the image is slightly blurred. (Example Buck Mason site)
Could you explain it a little bit more? I don't understand and i can't see the effect in that website
I think the OP is talking about this ---> https://jsfiddle.net/KyleMit/g74Ep/ What your asking for can be done with JavaScript
Yes! You can do with in css with a div that goes over all the elements of the page. In order to achieve this, you need to use a <div> with z-index higher than all the other elements in the DOM document. You want to try absolute positioning. If you're going to do this when the use goes over a div, you could try something like this using Jquery to detect the hover action: <script type="text/javascript"> $('#content').hover(function () { $(#overlay').css('display', ''); }); </script> <div id="content" style="height: 100%; width: 100%;">Main content here</div> <div id="overlay" style="display: none;z-index: 10; width: 100%; height: 100%;">This is the overlayed content</div> Code (markup): If you don't get it, you can read something here: http://stackoverflow.com/questions/2941189/how-to-overlay-one-div-over-another-div