Hey am developing a website where i want to display a div with a semi transparent background so that the page background is visible. i want this to work on all browsers. am fine using CSS , JS or jquery... please give me suggestions and if possible some sample code..
Thanks in advance, Raj
Probably your best bet is to use pure CSS. This technique works on Safari 3.2+, IE 5.5+, Firefox 3.05+, Chrome 4+, and Opera 10+
div {
/* black for browsers which cannot support rgba */
background-color: #000;
/* 70% opacity for supported browsers */
background-color: rgba(0, 0, 0, 0.7);
/* IE 5.5+ support #BB000000 is ~70% opacity on black */
filter:progid:DXImageTransform.Microsoft.gradient(
startColorstr=#BB000000, endColorstr=#BB000000
);
/* IE 8 support */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(
startColorstr=#BB000000, endColorstr=#BB000000
)";
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With