advanced code snippet search

Posted By

speck on 07/02/06


Tagged

css hack opacity


Versions (?)

Who likes this?

359 people have marked this snippet as a favorite

jonhenshaw
luman
arcturus
xaviaracil
Roshambo
designerd
alvaroisorna
joernba
splorp
meth
gardano
cochambre
samuraicoder
panatlantica
marc0047
jkochis
nicolaspar
px
hxseven
zensir
oronm
visualAesthetic
theMacpenguin
peterF
block
lhplam
koncept
KilgoreTrout67
icarus
nankoweap
shachi
Phoenix
happolati
n00ge
cmslounge
manub
m10
fragholrok
fael
rich13
asimovi
silverskymedia
vali29
heinz1959
SamuelMiller
aziz
hariharank12
sjaq
Winkyboy
sp1r1t
adix
skywalker
balinuxster
DFCNT
ernscht
usgraphicscom
stphnclysmth
sosof
vbert
readfred
wbowers
sbbath
maddesigns
gbot
adamsimms
mb
eorwoll
zeljkoprsa
rovision
themolitor
brent-man
stylz
mmccrack
mattkenefick
JustinCrossman
randylien
enajenkins
neb0
riz
pablodgavilan
jamesming
blackabee
Xek
crashdr
nickdoherty
loopdream
marouanomezzine
esquareda
ravenlp
SnipItPrpDemo
titox
conspirator
Leech
l1r
poGDI
zerolab
Wiederkehr
rubensarrio
dmatranga
chippper
asturi
pixelz
numtre
joaosalless
Sn0opy
salibaray
crisb
igor822
AlexWolfe
ilumin
aleprieto
LostCore
jder
Hilyin
jackomono
ozayo
yuindustries
mori
LeeRJohnson
elbuenob
bryandease
ping_ch
owais
Anber
johnnytoobad
Bolek
teamnirvana
adesignapart
nreliu
hamiltonmascioli
bigheadlyf
shali
tekbomb
ira
cmahoney
savintsev
danielfilho
fragmentist
nightowl
darkapple
exanimo9
spazione
onetwentysix
smart1
marcustrapp
novatvstdios
JustGreg
markoburns
obsessivejosh
carriegates
svnlto
Meander365
mmd
Blacksnipe
acosonic
mailstefsteide
brianyang
GrillPhil
isdereks
marvin_speakman
zoblue
scottyu
chirpyfalcon
ramnath
RagnarR
huynguye
thedeftone
unapersona
almazom
aahmed753
morvan
ruhanirabin
arunpjohny
adambundy
rwczippy
GandalfGrey
ditzah
tmbrenneke
laurasilvani
createinside
svenkaemper
eskey
Flocke
ksantoshp
olragon
bigredjoe
xpoint
cossette
active
ckayra
webtronix
portalpie
davidsp
scitrenbaumgmailcom
davidsi
eivind
jeeremie
dancrew32
dfaulty
geekyjohn
maxpensyl
delikassap
oktay
redstorm
kblair
ByGone
netzmensch
babel2675
ryanisinallofus
LyndseyPearce
fyreflyX
sammiikins
umang_nine
simondiercks
orangemittoo
digiteyes
aleyst
omardixon
sandynata
ahsanhabib
neri
fengelz
electblake
hades985
dkevey
d55beck
jonkemp
digitalifer
mogui
omerta83
jmaties
zwigby
postNuKe
tripdog
vehler
ofadlaoui
PerfectionDesign
sulco
fordsbasement
fillyouin
omayhemo
Fylhan
cartercole
giuliom
Swift-R
hasitha
hugomastromauro
Vals
pytheas
savantstyles
ahmedalttai
Aerendyl
jatap
vkolev
nextneed
pchengsf
reed
fauverism
koteus
czterystaczwarty
naeemnur
tedforbes
corangar
gnitter
robknight
adrianspiegel
seanpowell
bobbym245
azipagan
dakin01
cromozooom
mak
jfoy
jamiedollard
hugeidea
theOtherOne
vwal
Al-Kemist
muzafarova
nbehier
capsella
MrFjords
bigfish
okmores
geoffreydv
zreedeecom
mecha
tigr
creativeboulder
chris5marsh
cwulff
stevenlr
murtaugh
pablo808
connorjackson
claudiowebdesign
vaskointeractive
hernanvionnet
0leg
Moonsheeld
petrykowski
passion
RvDesigns
jacoborus
kenjikato
b1tstream
tspitzr
sohei
aegony
onemanstudio
sdxxx
foreverfriday
M-DieSign
kijtra
michellebracken
moopee1176
dismory
qubestream
samkamerer
shanssen
snakespan
anhonestboy
Creatiqfr
luckystokes
julianrhyswilliams
neex123
Woodruff
painteddigital
kenpar
wearefreya
germanny
freidamachoi
lickynee
albertomori
dajocko
sethetter
jondiscipulo
digitalink
SpinZ
merritt212
guo3823538
Briantjuh
henji4
wakeupandrage
nerdfiles
designspaceship
shalomfriss
SFLWebDev
ArnoldDC
dondalos
phuxen
redconservatory
guillaumelebas
tmh27
robotici
cekiert
timr
sommertim
mr2p


Opacity Hack

 / Published in: CSS
 

Sets the opacity of an element and its children. Doesn't validate. Mozilla began supporting the opacity rule in version 1.7, so '-moz-opacity' may not be necessary...

Expand | Embed | Plain Text 
  1. selector {
  2.   filter: alpha(opacity=60); /* MSIE/PC */
  3.   -moz-opacity: 0.6; /* Mozilla 1.6 and older */
  4.   opacity: 0.6;
  5. }

Report this snippet  

Comments

RSS Icon Subscribe to comments
Posted By: Roshambo on August 16, 2006

As a note, I believe, Gecko 1.7 was implemented in Firefox 1.5.

Posted By: Jo-W on October 8, 2008

Firefox 1.5 uses gecko 1.8 Firefox 1.0 uses gecko 1.7 So anything older then firefox 1.0 does not support opacity

Posted By: netsi1964 on November 13, 2008

Hi, In general I like the Idea of snippets, no doubt about that! But I would love to see some kind of standardilzation of them, preferable in a combination of XML, XSD (schema). You could then transform your XML snippet to what ever purpose you would need it in - say a HTML context. You can validate the input to the snippet using XSD. And some clever programmer might create add-ins for say MS Visual Studio 2008 or other commenly used development tools.

Here is my first thoughts about how it could be put together - based on this snippet for opacity:

Opacity hack
1.0
CSS



     {
    filter: alpha(opacity=); /* MSIE/PC */
    -moz-opacity: ; /* Mozilla 1.6 and older */
    opacity: ;
    }
Posted By: netsi1964 on November 13, 2008

Sorry the system didn't like me pasting XML into the comment field... I try again: Hi, In general I like the Idea of snippets, no doubt about that! But I would love to see some kind of standardilzation of them, preferable in a combination of XML, XSD (schema). You could then transform your XML snippet to what ever purpose you would need it in - say a HTML context. You can validate the input to the snippet using XSD. And some clever programmer might create add-ins for say MS Visual Studio 2008 or other commenly used development tools. Here is my first thoughts about how it could be put together - based on this snippet for opacity: Opacity hack 1.0 CSS { filter: alpha(opacity=); / MSIE/PC / -moz-opacity: ; / Mozilla 1.6 and older / opacity: ; }

Posted By: netsi1964 on November 13, 2008

Sorry - I simply couldnt make my comment containing XML example. So I wrote an article on my blog: http://netsi1964.blogspot.com/ - feel free to read it :-)

Posted By: jadedbat on November 25, 2008

This method does not validate but surely works.. cool with hovers.

Posted By: bucabay on September 3, 2009

To make CSS validate, it is better to set Opacity from JS for older browsers.

Posted By: almazom on October 20, 2009

i use jquery $(selector).css('opacity','.6')

Posted By: shapeshifta on January 5, 2010

yeah, but this has the same effect. it triggers the css in the described way, so why not just use css? :)

Posted By: sb_01 on September 19, 2010

http://css3please.com/ :)

Posted By: vagrantradio on September 24, 2010

@almazom:

Don't try to fix things with JavaScript, websites should function properly with it. JavaScript is merely an enhancement, and should be used as such.

Posted By: marco135 on January 25, 2011

100% crossbrowser hack: .class { filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; }

from http://css-tricks.com/css-transparency-settings-for-all-broswers/

Posted By: Placehold on July 1, 2011

Use

filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);

As a fall back for IE

Posted By: amandalaine on September 12, 2011

The right column says "355 people have marked this snippet as a favorite". How do I mark a snippet as a favorite?!?! I have been trying to do this... for months. I don't see the button anywhere on the interface. Thank you. I'm really looking forward to an answer from someone. Thank you in advance!!!!

You need to login to post a comment.