Wpisy oznaczone tagiem przeźroczyste tło

Popup z półprzeźroczystym tłem

Ostatnio musiałem zrobić takie małe cudo. Popup na warstwie z półprzeźroczystym tłem wokół popup’a. Podejście rzucające się od razu na myśl czyli :

  • div z opacity
  • na tym div z pełnym tłem

Coś takiego nie zda egzaminu, wszystko co będziemy mieli nad naszym divem półprzeźroczystym także będzie półprzeźroczyste.

Innym rozwiązaniem powinno być podzielenie naszego widoku na 9 obszarów. Centralna cześć będzie naszym popupem, reszta będzie spełniała rolę tła.

Najprościej zrealizować to na tabeli, trochę więcej zachodu będzie z divami.

Przykładowa półprzeźroczysta klasa powinna wyglądać tak (krycie 75% oraz czarne tło) :

filter: alpha(opacity=75); /*starsze IE*/
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=75); /* IE */
-moz-opacity: .75; /*starsza Mozilla*/
-khtml-opacity: 0.75;   /*starsze Safari*/
opacity: 0.75;   /*wspierane przez Mozilla, Safari oraz Opera*/
background-color:#000000;

Trzeba pamiętać z będzie problem z uzyskaniem przeźroczystości nad elementami Flashowymi.

, , , ,

Brak komentarzy