Generally this is no rocket science, using the CSS3 attribute “opacity”, unfortunately CSS3 is not supported by many browsers. As an alternative one could use JavaScript, which also might not work everywhere (if disabled due to security measures). So the easy way only works in the latest versions of Firefox and Opera.
(Take a look at a live demo here)
In order to get this working in all the browsers (Ok, using IE6 we’ll have to trick a little bit, but we’ll discuss this later) we have to approach this in a sneaky way.
Here is a simple, fast, lean, cross browser functional and JavaScript free method, only using plain HTML, CSS and graphical elements:
Read the rest of this entry »
Author: mr-mojo-risin
- Tags: background, browser, chrome, code, css, div, effect, firefox, graphic, hint, IE6, IE6 hack, IE7, Mouse Over, mouseover, Opacity, opera, transparency, trick
CSS (cascading style sheets) is the ultimate tool to create lean, fast, functional, SEO friendly and, though, sexy layouts. Storing style attributes in one file provides several advantages as faster loading times, the source code takes a radical diet, if all the attributes do not appear on the pages itself.
You are web designer and have to work full contact with the customer? Then you will know this situation, the customer wants that headline bold and purple – no, make it green or is blue a better choice? This goes back and forth, which would make you go crazy if you had to do the changes on thousands of subpages. Using CSS you do changes faster than the customer decides between green and yellow.
Read the rest of this entry »
