Blog

Stín okolo objektu pomocí CSS nebo jQuery

06.01.2011 shadow, stín, jQuery, css

Stín okolo objektu lze vytvořit pomocí CSS vlastnosti:

box-shadow: barva posunX posunY hloubka


Podpora v jednotlivých prohlížečích:

IE 9+:
filter: progid: DXImageTransform.Microsoft.Blur(PixelRadius='15', MakeShadow='true', ShadowOpacity='0.40');


FF -moz-box-shadow

Chrome -webkit-box-shadow

Nejlépe tedy pro všechny prohlížeče:

.stin { box-shadow: black 2px 5px 10px;
-webkit-box-shadow: black 2px 5px 10px;
-moz-box-shadow: black 2px 5px 10px; filter: progid: DXImageTransform.Microsoft.Blur(PixelRadius='15', MakeShadow='true', ShadowOpacity='0.40');
}


Nebo použít Boxshadow plugin jQuery

Další příklady pro IE:

filter:progid:DXImageTransform.Microsoft.Shadow(color='#000000',direction='120',strength='20');
filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='15',MakeShadow='true',ShadowOpacity='0.40');
filter:progid:DXImageTransform.Microsoft.DropShadow(color='#000000',offX='20',offY='20');


Zpět na seznam článků

Tagy