Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [XHTML/CSS] z-index a style polozenia diva
kamiseq
post
Post #1





Grupa: Zarejestrowani
Postów: 139
Pomógł: 0
Dołączył: 12.07.2005
Skąd: krakow

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


chodzi mi o to ze z-index nie chce dzialac dopuki nie dam position: absolute

chcialbym zeby jednemu divowi nadac styl float: left i drugiemu tez i nadac rozne wartosci z-index tak aby na siebie naszly?

nie chce dzialac:), bo sprawdzalem(chyba ze cos zle poustawialem w stylach); czy jest jakis sposob zeby to ominac?

bardzo by mi sie przydalo bo robic layout na top, left, right jest malo efektywne. co chce osiagnac? efekt ze tekst z diva nizej wchodzi pod graficzne elementy diva nad soba.

tak na marginesie dlaczego nikt tego nie wykorzystuje do ochrony zdjec? z tego co zauwazylem to uzywacie php do nalozenia dodatkowej warstwy, podczas gdy bez wysilku mozna rozciagnac dodatkowy div nad tym zdjeciem i to tak samo zablokuje mozliwosc sciagniecia zdjecia na dysk, myle sie? guitar.gif
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi (1 - 14)
sztosz
post
Post #2





Grupa: Zarejestrowani
Postów: 866
Pomógł: 32
Dołączył: 2.06.2004
Skąd: Wrocław

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


Cytat(kamiseq @ 2006-04-09 20:51:48)
to tak samo zablokuje mozliwosc sciagniecia zdjecia na dysk, myle sie? guitar.gif

Niestety mylisz się, wytarczy w źródło spojrzeć aby "wyczaić" link do pliku graficznego, a potem to już z górki winksmiley.jpg

Ten post edytował sztosz 9.04.2006, 22:54:34


--------------------
Go to the top of the page
+Quote Post
yavaho
post
Post #3





Grupa: Zarejestrowani
Postów: 449
Pomógł: 0
Dołączył: 26.05.2004
Skąd: Nowy Sącz

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


Cytat(kamiseq @ 2006-04-09 21:51:48)
chodzi mi o to ze z-index nie chce dzialac dopuki nie dam position: absolute
Jezeli uzywasz stylu float, to nie nalozysz jednej warstwy na druga. Ten styl definiuje jak mają sie układać obok siebie sąsiednie elementy, a nie jeden na drugim.
A z-index stosuje sie najczesciej ze stylem position:absolute (albo i zawsze z nim jak sie nie myle?)

Jak ulozysz kilka wastw jedna na drugiej stosujac styl position:absolute to stylem z-index zmienisz tylko kolejnosc ulozenia warstw (jedan na drugiej) w stosunku do kolejnosci w jakiej wystepuja w kodzie html.

Cytat(kamiseq @ 2006-04-09 21:51:48)
tak na marginesie dlaczego nikt tego nie wykorzystuje do ochrony zdjec?
Uzywa, uzywa tylko sie nie chwali smile.gif Jak by sie pochwalił to by nie miało to sensu.

Cytat(kamiseq @ 2006-04-09 21:51:48)
z tego co zauwazylem to uzywacie php do nalozenia dodatkowej warstwy
Tu masz troche błedne myślenie - php moze jedynie generować kod html lub css.

Ten post edytował yavaho 9.04.2006, 22:47:54


--------------------
Książki informatyczneKsiążki biznesowe
Warsztat: notepad hardcore
Go to the top of the page
+Quote Post
revyag
post
Post #4





Grupa: Przyjaciele php.pl
Postów: 2 258
Pomógł: 16
Dołączył: 21.09.2004
Skąd: Kielce

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


z-index można zastosować z position: absolute,relative,fixed, ale ie nie obsługuje fixed, więc jesteśmy właściwie ograniczeni do tych dwóch pierwszych.

@kamiseq php można użyć do ochrony zdjęć, tworząc kod który będzie je generował w w odpowiedni sposób(możesz poszukać na forum, bo był taki temat parę razy), ale nigdy nie uzyskasz 100% zabezpieczeń.


--------------------
-------------

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





Grupa: Zarejestrowani
Postów: 139
Pomógł: 0
Dołączył: 12.07.2005
Skąd: krakow

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


nie chce zakladac nowego tematu wiec.....
mam taka stronke[link]
i jak widziecie jest tam czerwony prostokat.

chce zeby to wygladalo tak jak sobie zaprojektowalem [projekt]

nadalem mu z-index :20;
tylko pojawia sie problem ze:
1) jak przypisze tamtemu blokowi position absolute to nie wiem jak go ułozyc zeby zawsze byl w tym samym miejscu przy roznych rozdzielczosciach( moze to nie jest problem)
2) jak dam relative to wtedy sie uklad kaszani bo przegladarka rezerwuje miejsce na ten blok mimo ze nie ma go w tamtym miejscu

wiem ze moge to zrobic inaczej ale narazie chcialem tak:]
jakas pomoc?:]
Go to the top of the page
+Quote Post
yavaho
post
Post #6





Grupa: Zarejestrowani
Postów: 449
Pomógł: 0
Dołączył: 26.05.2004
Skąd: Nowy Sącz

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


Jak nadajesz elementowu styl position absolute to wtedy musisz mu ustalic gorny i lewy margines od krawedzi wczesniejszego elementu (rodzica) w ktorym ten elemet sie znajduje.
W Twoim przypadku wczesniejszym elementem nie moze być body lub element ktorego szerokosc moze byc zmienna w zaleznosći od rozdzielczosci ekranu.
  1. <body style="text-align:center;">
  2. <div style="width:400px; margin:auto; text-align:left; background:#eeeeee;">
  3. <div style="position:absolute; margin: 0 0 0 300px; width:100px; height:100px; border: 1px solid red;"></div>
  4. tekst<br /><br /><br /><br /><br />
  5. tekst<br /><br /><br /><br /><br />
  6. tekst<br /><br /><br /><br /><br />
  7. </div>
  8. </body>
  9. </html>

Ale ta grafike mozesz rownie dobrze wstawic jako niepowtarzajace sie tło wyrownane do prawej.

Ten post edytował yavaho 12.04.2006, 23:46:59


--------------------
Książki informatyczneKsiążki biznesowe
Warsztat: notepad hardcore
Go to the top of the page
+Quote Post
kamiseq
post
Post #7





Grupa: Zarejestrowani
Postów: 139
Pomógł: 0
Dołączył: 12.07.2005
Skąd: krakow

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


wiem wiem, ale chce sie pobawic z z-indexem, i jak to sie wogole wyswietla:], pozatym w ten sposob nakladam taka duza warstwe i mi sie napewno nie rozjedzie w IE:] a tak muszialbym to ciac

hym a z tego co tu widze to ja uzylem stylu right i top ktory spowodowal problem!

Ten post edytował kamiseq 13.04.2006, 07:49:54
Go to the top of the page
+Quote Post
yavaho
post
Post #8





Grupa: Zarejestrowani
Postów: 449
Pomógł: 0
Dołączył: 26.05.2004
Skąd: Nowy Sącz

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


Z-index sluzy raczej tylko do jednego. Juz to napisałem:
Cytat
Jak ulozysz kilka wastw jedna na drugiej stosujac styl position:absolute to stylem z-index zmienisz tylko kolejnosc ulozenia warstw (jedan na drugiej) w stosunku do kolejnosci w jakiej wystepuja w kodzie html.
Poprzez zastosowanie z-index mozesz osiagnac tez taki efekt, ze warstwa (grafika) ktora jest u gory bedzie wczesniej sciagnieta z serwera od tej warstwy ktora lezy pod nią. Bo pobieranie grafiki z serwera jest w takiej kolejnosci w jakiej wystepuje w kodzie html.


--------------------
Książki informatyczneKsiążki biznesowe
Warsztat: notepad hardcore
Go to the top of the page
+Quote Post
revyag
post
Post #9





Grupa: Przyjaciele php.pl
Postów: 2 258
Pomógł: 16
Dołączył: 21.09.2004
Skąd: Kielce

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


Cytat
Poprzez zastosowanie z-index mozesz osiagnac tez taki efekt, ze warstwa (grafika) ktora jest u gory bedzie wczesniej sciagnieta z serwera od tej warstwy ktora lezy pod nią. Bo pobieranie grafiki z serwera jest w takiej kolejnosci w jakiej wystepuje w kodzie html.


Chcesz powiedzieć że przeglądarka najpierw popatrzy na z-index i dopiero potem ściągnie obrazek ? smile.gif
Idąc dalej tym tokiem rozumowania, przeglądarka nie będzie ściągać obrazków, jeśli dam im styl display:none smile.gif

Kolejność ściągania obrazków zależy tylko od kolejności umieszczania tagów <img> w kodzie html.


--------------------
-------------

------
Go to the top of the page
+Quote Post
yavaho
post
Post #10





Grupa: Zarejestrowani
Postów: 449
Pomógł: 0
Dołączył: 26.05.2004
Skąd: Nowy Sącz

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


@revyag przeczytaj dokładnie do konca to co napisałem, a zwlaszcza ostatnie zdanie


--------------------
Książki informatyczneKsiążki biznesowe
Warsztat: notepad hardcore
Go to the top of the page
+Quote Post
revyag
post
Post #11





Grupa: Przyjaciele php.pl
Postów: 2 258
Pomógł: 16
Dołączył: 21.09.2004
Skąd: Kielce

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


To może powiedz co miałeś na myśli pisząć to:

Cytat
Poprzez zastosowanie z-index mozesz osiagnac tez taki efekt, ze warstwa (grafika) ktora jest u gory bedzie wczesniej sciagnieta z serwera od tej warstwy ktora lezy pod nią.


Jakby tego zdania nie było to bym nic nie napisał.


--------------------
-------------

------
Go to the top of the page
+Quote Post
yavaho
post
Post #12





Grupa: Zarejestrowani
Postów: 449
Pomógł: 0
Dołączył: 26.05.2004
Skąd: Nowy Sącz

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


ech
Wiadomo ze grafika sciaga sie z serwera w takiej kolejnosci w jakiej wystepuje w kodzie html. I jezeli nalozymy na siebie dwie warstwy (bez stylu z-index) , to najpierw sciagnie sie ta dolna warstwa a potem ta górna.
Ale gdy ustalimy dla nich odpowiedni z-index i zmienimy kolejnosc w kodzie html to uzyskamy to co wczesniej napisałem.
  1. <!--to jest warstwa gorna a pojawi sie na stronie jako pierwsza-->
  2. <img src="warstwa-górna.gif" style="z-index:2;">
  3. <!--to jest warstwa dolna i pojawi sie na stronie jako druga-->
  4. <img src="warstwa-dolna.gif" style="z-index:1;">
Normalnie bez z-index, to w pierwszej kolejnosci bedzie sie pojawiała grafika ktora jest w warstwie na samym dole itd.


--------------------
Książki informatyczneKsiążki biznesowe
Warsztat: notepad hardcore
Go to the top of the page
+Quote Post
kamiseq
post
Post #13





Grupa: Zarejestrowani
Postów: 139
Pomógł: 0
Dołączył: 12.07.2005
Skąd: krakow

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


a nie rozumiem, jak chcesz nalozyc na siebuie dwie warsty bez z-index?

mowisz moze o nachodzeniu na siebie divow jak cos tam pochrzanisz? czy ze np uzyjesz position relative/absolute. mysle ze to sa wogle oddzielne tematy. bo po co by byl w takim razie z-index?
Go to the top of the page
+Quote Post
yavaho
post
Post #14





Grupa: Zarejestrowani
Postów: 449
Pomógł: 0
Dołączył: 26.05.2004
Skąd: Nowy Sącz

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


Cytat(kamiseq @ 2006-04-13 17:08:05)
a nie rozumiem, jak chcesz nalozyc na siebuie dwie warsty bez z-index?
Do nakładania warst jeda na drugą służy position:absolute
z-index sluzy jedynie do zmiany kolejnosci ułozenia tych warsw w stosunku do kolejności jaka występuje w kodzie html. css z-index

Przykład z mojej strony z zastosowaniem z-index galelria
Podczas ogłądania jednej fotografii następne dwie się ściągają z serwera (coś jakby buforowanie następnych fotografi, ktore bedą za chwile oglądane), a dzieki z-index te ściągane fotografie znajdują się pod spodem pod oglądaną fotografią.


--------------------
Książki informatyczneKsiążki biznesowe
Warsztat: notepad hardcore
Go to the top of the page
+Quote Post
kamiseq
post
Post #15





Grupa: Zarejestrowani
Postów: 139
Pomógł: 0
Dołączył: 12.07.2005
Skąd: krakow

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


dla zainteresowanych to posredni efekt
jest taki ->[efekt] tylko pod ie to sie kaszani ma ktos jakis pomysl?
Go to the top of the page
+Quote Post

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

 



RSS Aktualny czas: 20.08.2025 - 13:30