Forum PHP.pl > [JavaScript] okno na stronie

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [JavaScript] okno na stronie

Forum PHP.pl > Forum > Przedszkole

r4xz

4.05.2009, 14:07:58

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

a więc, potrzebuje pomysłu (natchnienie

) 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...

proszę o jakieś pomysły, ale nie gotowe skrypty - nie lubie bezsensownego kopiowania i wklejania... wole zrobić sam i mieć satysfakcję

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.

Spawnm

4.05.2009, 15:00:03

to może w js sprawdzaj wysokość i szerokość monitora odwiedzającego i na takie wymiary robisz diva

outsider

4.05.2009, 15:00:40

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%

r4xz

4.05.2009, 17:03:48

dzięki. sposób z pobraniem wysokości/szerokości wypalił

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

mój kod:

Kod

<div id=transparent>

           <div class=wrap>

              <div class=tekst>

                 <a href="#" onClick="pokaz('login')">ukryj</a> 

  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...

outsider

4.05.2009, 18:36:13

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 
<div id=transparent>
  <div class=wrap>
    <div class="polprzezroczysty"></div>
    <div class=tekst>
        <a href="#" onClick="pokaz('login')">ukryj</a> <!-- ZMIANA WIDOCZNOSCI -->
   afsasfasffsaafsafsafs
    </div>
    <div class="polprzezroczysty"></div>           
  </div>      
</div>
[HTML] pobierz, plaintext

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

r4xz

4.05.2009, 18:57:24

niezbyt rozumiem o co ci chodzi

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.

#luq

4.05.2009, 19:17:22

Kod

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

r4xz

4.05.2009, 19:22:07

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

outsider

4.05.2009, 19: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.

r4xz

4.05.2009, 19:43:43

Cytat(*OuTSideR* @ 4.05.2009, 20:23:05 )

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ę

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

outsider

4.05.2009, 19:58:19

nie zrobisz tego inaczej

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

r4xz

4.05.2009, 20:47:32

Cytat(*OuTSideR* @ 4.05.2009, 20:58:19 )

nie zrobisz tego inaczej

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ę

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

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.