Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JavaScript] okno na stronie
r4xz
post
Post #1





Grupa: Zarejestrowani
Postów: 673
Pomógł: 106
Dołączył: 31.12.2008

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

odrazu mówię, że nie wiedziałem jak nazwać temat... wstydnis.gif

a więc, potrzebuje pomysłu (natchnienie haha.gif) w jaki sposób mógłbym zrobić, aby po kliknięciu linka cała strona zrobiła się jakby niedostępna. może jest jakaś opcja na "zablokowanie" jakiegoś obiektu z danym id, np. <body> lub <div>?? myślałem też nad zrobieniem diva, który będzie na całą stronę z pół przezroczystą grafiką, ale to mi nie wychodziło pod względem css - przystosowaniem do każdej przeglądarki/rozdzielczości. Narazie stanełem na tym, że po kliknięciu w link wyświetla mi się tylko div na wierzchu, ale nadal można robić coś na stronie w tyle... sciana.gif
proszę o jakieś pomysły, ale nie gotowe skrypty - nie lubie bezsensownego kopiowania i wklejania... wole zrobić sam i mieć satysfakcję smile.gif

PS chodzi o coś takiego jak jest np. na fotoblogach. klikasz powiększenie zdjęcia i wszystko robi się przyciemnione, a tylko powiększone zdjęcie na środku normalne.


--------------------
GitHub
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 11)
Spawnm
post
Post #2





Grupa: Moderatorzy
Postów: 4 069
Pomógł: 497
Dołączył: 11.05.2007
Skąd: Warszawa
to może w js sprawdzaj wysokość i szerokość monitora odwiedzającego i na takie wymiary robisz diva
Go to the top of the page
+Quote Post
outsider
post
Post #3





Grupa: Zarejestrowani
Postów: 267
Pomógł: 36
Dołączył: 8.08.2008

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

po kliknieciu:
1) stworzyc div:
- position:absolute;
- background: url(images/pattern.png) repeat;
- top:0;
- left:0;
2) pobrac wysokosc(height) elementu body/html:
- stworzonemu div'owi nadac ta wysokosc
- oczywiscie tez musi miec szerokosc(width) na 100% - jesli body/html nie ma, chociaz top i left juz powinno dac ze bedzie 100%
Go to the top of the page
+Quote Post
r4xz
post
Post #4





Grupa: Zarejestrowani
Postów: 673
Pomógł: 106
Dołączył: 31.12.2008

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

dzięki. sposób z pobraniem wysokości/szerokości wypalił smile.gif
edit: ten drugi też ;]

_________________________________

www.a-b-c-d.yoyo.pl
kliknijcie w mały link "poka". Jak zrobić aby w tym oknie pod tekstem "ukryj
afsasfasffsaafsafsafs" tło było już nieprzezroczyste. próbowałem jakoś za pomocą z-index (tak na google wyczytałem), ale nic z tego sciana.gif

mój kod:
Kod
<div id=transparent>
        
           <div class=wrap>
  
              <div class=tekst>
        
                 <a href="#" onClick="pokaz('login')">ukryj</a> <!-- ZMIANA WIDOCZNOSCI -->
                
  afsasfasffsaafsafsafs
        
              </div>
          
           </div>
        
        </div>


Kod
#transparent {
     position: absolute; top: 0; left: 0;
     width: 100%;
     height: 100%;
     background-color: #363636;
     opacity: 0.8; filter: alpha(opacity=80);
  }
  
     #transparent .wrap {
        padding: 10px 0px 10px 0px;
        position: relative; top: 50px; left: 0;
        background-color: #000000;
     }
  
        #transparent .wrap .tekst {
           background-color: #000000;
           color: #FFFFFF;
           width: 500px;
           text-align: left;
        }


PS próbowałem też dla "#transparent .wrap .tekst" zrobić coś w stylu : "opacity: 1.0; filter: alpha(opacity=100);" ale też nie działa... sciana.gif

Ten post edytował r4xz 4.05.2009, 17:04:30


--------------------
GitHub
Go to the top of the page
+Quote Post
outsider
post
Post #5





Grupa: Zarejestrowani
Postów: 267
Pomógł: 36
Dołączył: 8.08.2008

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

zrob 3 divy objete jednym glownym(czyli ten z pobranym width i height strony) ktory nie ma nadanego background:
1 div polprzezroczysty(nad tekstem)
2 div przezroczysty (z tekstem)
3 div polprzezroczysty(pod tekstem)

Czyli cos takiego:
[HTML] pobierz, plaintext 
  1. <div id=transparent>
  2.   <div class=wrap>
  3.     <div class="polprzezroczysty"></div>
  4.     <div class=tekst>
  5.         <a href="#" onClick="pokaz('login')">ukryj</a> <!-- ZMIANA WIDOCZNOSCI -->
  6.    afsasfasffsaafsafsafs
  7.     </div>
  8.     <div class="polprzezroczysty"></div>           
  9.   </div>      
  10. </div>
[HTML] pobierz, plaintext

-nie wiem po co .wrap jest, ale mniej wiecej wiesz o co chodzi smile.gif

Ten post edytował *OuTSideR* 4.05.2009, 18:39:48
Go to the top of the page
+Quote Post
r4xz
post
Post #6





Grupa: Zarejestrowani
Postów: 673
Pomógł: 106
Dołączył: 31.12.2008

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

niezbyt rozumiem o co ci chodzi worriedsmiley.gif
więc zrobiłem mniej więcej rozrys o co mi chodzi. widać na nim podział na divy (ten wrap to jest z nawyku przy robieniu np. menu kiedy każdy pixel ma znaczenie, bo na starszych IE źle interpretuje inaczej... ;p)

to teraz właśnie chce aby "czerwony" i "zielony" div był przezroczysty, a żółty już nie.


--------------------
GitHub
Go to the top of the page
+Quote Post
#luq
post
Post #7





Grupa: Zarejestrowani
Postów: 589
Pomógł: 91
Dołączył: 22.05.2008
Skąd: Gliwice

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

Kod
.tekst {
     opacity = 1;
     filter: alpha(opacity=100);
}


--------------------
Moja gra - scraby.io
Go to the top of the page
+Quote Post
r4xz
post
Post #8





Grupa: Zarejestrowani
Postów: 673
Pomógł: 106
Dołączył: 31.12.2008

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

Cytat(#luq @ 4.05.2009, 20:17:22 ) *
Kod
.tekst {
       opacity = 1;
       filter: alpha(opacity=100);
  }


gdyby to było takie proste... niestety to już próbowałem i nie działa.

PS jedyne co mi teraz przychodzi to zrobić to w głupi sposób, który zaraz sprawdzę. zrobię diva o wymiarach na całą stronę, potem zrobię tabele 3x3 i środek dam czysty haha.gif

Ten post edytował r4xz 4.05.2009, 19:23:53


--------------------
GitHub
Go to the top of the page
+Quote Post
outsider
post
Post #9





Grupa: Zarejestrowani
Postów: 267
Pomógł: 36
Dołączył: 8.08.2008

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

http://img8.imageshack.us/img8/3043/20084526.png
teraz opisze:
podziel divy tak jak na screenie jest, jak sa 2 takiej samej nazwy tzn. ze maja ta samo klase. Div3 bedzie bez background, div1 i div2 tak, wszystko bedzie w innym divie bez background.
Go to the top of the page
+Quote Post
r4xz
post
Post #10





Grupa: Zarejestrowani
Postów: 673
Pomógł: 106
Dołączył: 31.12.2008

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

Cytat(*OuTSideR* @ 4.05.2009, 20:23:05 ) *
http://img8.imageshack.us/img8/3043/20084526.png
teraz opisze:
podziel divy tak jak na screenie jest, jak sa 2 takiej samej nazwy tzn. ze maja ta samo klase. Div3 bedzie bez background, div1 i div2 tak, wszystko bedzie w innym divie bez background.


wszystko ładnie pięknie, ale...
jestem zbyt uzależniony od liczb (%). Jeśli ich nie podam wszystko nie przylega do "ścianek". A zrobienie np. border w divie 3 psuje całą strukturę dry.gif

PS poszukuję bardziej praktycznych rozwiązań, a tu jest pies pogrzebany.

Ten post edytował r4xz 4.05.2009, 19:44:29


--------------------
GitHub
Go to the top of the page
+Quote Post
outsider
post
Post #11





Grupa: Zarejestrowani
Postów: 267
Pomógł: 36
Dołączył: 8.08.2008

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

nie zrobisz tego inaczej smile.gif jak pod spodnia warstwa masz juz background to nad warstwa wyzej go nie usuniesz. Jesli dodasz border (1px) to powiekszasz o 2px (height) Div2 - 2px bo z gory i dolu powieksza sie div
Go to the top of the page
+Quote Post
r4xz
post
Post #12





Grupa: Zarejestrowani
Postów: 673
Pomógł: 106
Dołączył: 31.12.2008

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

Cytat(*OuTSideR* @ 4.05.2009, 20:58:19 ) *
nie zrobisz tego inaczej smile.gif jak pod spodnia warstwa masz juz background to nad warstwa wyzej go nie usuniesz. Jesli dodasz border (1px) to powiekszasz o 2px (height) Div2 - 2px bo z gory i dolu powieksza sie div


a jednak się udało, czas spędzony na leżeniu w łóżku i myśleniu opłacił się smile.gif
google nie kłamie... sposób z z-index jest najlepszy - no i praktyczny, bo nie ma zbędnych liczb.

PS ale mimo wszystko dziękuje za pomoc winksmiley.jpg


--------------------
GitHub
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: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

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

RSS Aktualny czas: 22.08.2025 - 09:16
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn