Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [CSS][HTML]przyciemnianie diva podrzędnego
jeremiash
post 10.01.2013, 15:41:14
Post #1





Grupa: Zarejestrowani
Postów: 94
Pomógł: 5
Dołączył: 6.11.2012

Ostrzeżenie: (0%)
-----

Cześć. Nakładam na siebie dwa divy - dzieje się to przy wywołaniu jakiejś strony z danymi. Chciałbym, aby div podrzędny z grafiką został przytłumiony np. 80%, a nadrzędny był wyrazisty.

Próbowałem wykorzystać 

[PHP] pobierz, plaintext 
  1. 	 filter:alpha(opacity=70);
  2. 	opacity: 0.7;
  3. 	-moz-opacity:0.7;
[PHP] pobierz, plaintext


jednak to ingeruje w oba divy... ekran. Proszę o pomoc... 

[PHP] pobierz, plaintext 
  1.  
  2. #podrzedny { 
  3. padding: 0px 0px 0px 0px;
  4. margin:0;
  5. width: 100%;
  6. height: 100%;
  7. position: absolute; 
  8. top: 0px;
  9. overflow:hidden;
  10. float: left;
  11. z-index:100;
  12. }
  13.  
  14. #nadrzedny { 
  15. padding: 0px 0px 0px 0px;
  16. margin:0;
  17. width: 100%;
  18. height: 100%;
  19. position: absolute; 
  20. top: 0px;
  21. overflow:hidden;
  22. float: left;
  23. z-index:110;
  24.  
  25. }
  26.  
[PHP] pobierz, plaintext


Ten post edytował jeremiash 10.01.2013, 15:41:48
Go to the top of the page
+Quote Post
Sephirus
post 10.01.2013, 16:30:29
Post #2





Grupa: Zarejestrowani
Postów: 1 527
Pomógł: 438
Dołączył: 28.06.2011
Skąd: Warszawa

Ostrzeżenie: (0%)
-----

Spójrz tu

Widzę że tam kombinujesz w tym podrzędnym z floatem itd... w linku masz najprostszy możliwy przykład.

EDIT: Po zastanowieniu chyba nie do końca obczaiłem temat :/

Ten post edytował Sephirus 10.01.2013, 16:42:42


--------------------
If you're good at something, never do it for free.
Potrzebujesz skryptu JS lub PHP - szukasz kogoś kto przetestuje twoją aplikację pod względem bezpieczeństwa? Szybko i solidnie? Napisz ;)
Mój blog - Jak zwiększyć wydajność front-endu - O buforowaniu wyjścia w PHP słów kilka...
Go to the top of the page
+Quote Post
bpskiba
post 10.01.2013, 17:14:00
Post #3





Grupa: Zarejestrowani
Postów: 340
Pomógł: 49
Dołączył: 3.07.2009
Skąd: Rzeszów

Ostrzeżenie: (0%)
-----

Taki kompletny przykładzik...

[HTML] pobierz, plaintext 
  1. <html>
  2. <style>
  3. .a1{
  4.     position : absolute ;
  5.     display:none;
  6.     background : yellow ;
  7.     z-index : 5 ;
  8.     width : 100% ;
  9.     height : 100% ;
  10.     opacity:0.8;
  11.     filter:alpha(opacity=80);
  12.    }
  13. .a2{
  14.    position : absolute ;
  15.    display: none;  
  16.    width : 300px ;
  17.    background: red;
  18.    z-index :9;  
  19.    top :150px ;
  20. }   
  21. </style>
  22. <script language="javascript" type="text/javascript">
  23. function f1()
  24.     {
  25.      document.getElementById("t1").style.display="inline";
  26.      document.getElementById("t3").style.display="inline";
  27.      document.getElementById("t3").style.right=(screen.width/2)-150;
  28.  
  29.     }
  30. function f2()
  31.     {
  32.     document.getElementById("t1").style.display="none";
  33.     document.getElementById("t3").style.display="none";
  34.     }
  35. function f3()
  36.     {
  37.     document.getElementById("e1").innerHTML=document.getElementById("r1").checked;
  38.     document.getElementById("e2").innerHTML=document.getElementById("r2").checked;
  39.     f2();
  40.     }    
  41. </script>
  42.  <body>
  43.  <div class="a1" id="t1"></div>
  44. <form>
  45. <table class="a2"  id="t3">
  46. <tr><td align="left" width=99%>Wybierz opcję</td><td></td><td align="right"><div onclick="f2();"><a href="">zamknij&nbsp[X]</a></div></td></tr>
  47. <tr><td align="left"> &nbsp;</td><td> </td><td></td></tr>
  48. <tr><td align="left">Opcja 1</td><td><input type="checkbox" id="r1"></td>&nbsp;<td></td></tr>
  49. <tr><td align="left">Opcja 2</td><td><input type="checkbox" id="r2"></td>&nbsp;<td></td></tr>
  50. <tr><td align="left"> &nbsp;</td><td> </td><td></td></tr>
  51. <tr><td align="left"> <input type="button" value="  Zapisz  " onclick="f3();"></td><td><input type="button" value="Zrezygnuj" onclick="f2();"></td><td></td></tr>
  52. </table>
  53. </form>
  54. <a href="#"><div onclick="f1();">pokaż</div></a><br><br>
  55. <div id="e1"></div>
  56. <div id="e2"></div>
  57. </body>
  58. </html>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
jeremiash
post 10.01.2013, 18:44:39
Post #4





Grupa: Zarejestrowani
Postów: 94
Pomógł: 5
Dołączył: 6.11.2012

Ostrzeżenie: (0%)
-----

Dziękuję Wam koledzy, problem został rozwiązany.
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 15.08.2025 - 02:41
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn