 [css] Rozwijane menu i pozycja absolute |
| [css] Rozwijane menu i pozycja absolute |
 7.05.2004, 10:58:57
Post
#1
|
|
 Grupa: Zarejestrowani Postów: 222 Pomógł: 0 Dołączył: 3.04.2003 Skąd: Wrocław Ostrzeżenie: (0%) 
 |
Witam.
Mam rozwijane menu javascript (gotowe, ściągnięte z netu) i jak to bywa w przypadku takich menu trzeba je umieścić na stronie w pozycji absolutnej. Stwarza to w moim projekcje problem: moja strona jest co prawda o stałej szerokości, ale jest wyśrodkowana i niemożliwe jest wtedy umieszczenie menu w porządanym miejscu. Menu jest oparte na divach w pozycji absolutnej. Czy da się takiego diva przypiąć do jakiegoś innego elementu niż body? Moge też zmieniać style dla tych divów i w ogóle cała strukturę xhtml menu. Może za pomocą rozmieszczenia relatywnego da się rozwiązać problem? -------------------- pozdrawiam, chfast
|
 |
 
|
 |
|
7.05.2004, 14:59:05
Post
#2
|
|
 Grupa: Zarejestrowani Postów: 339 Pomógł: 0 Dołączył: 17.06.2003 Skąd: Białystok Ostrzeżenie: (0%)
|
Cytat Może za pomocą rozmieszczenia relatywnego da się rozwiązać problem?
Tak, wlasnie do tego jest pozycjonowanie relatywne. -------------------- |
|
|
|
|
7.05.2004, 16:35:45
Post
#3
|
|
|
Grupa: Zarejestrowani Postów: 222 Pomógł: 0 Dołączył: 3.04.2003 Skąd: Wrocław Ostrzeżenie: (0%)
|
Cytat Cytat Może za pomocą rozmieszczenia relatywnego da się rozwiązać problem?
Tak, wlasnie do tego jest pozycjonowanie relatywne. No tak. Ale wszystkie te divy trzeba najpierw gdzieś umieścić, aby można było je później przesuwać. Nie wiem jak ja mam znaleźć miejsce na kilkanaście pozycji menu. -------------------- pozdrawiam, chfast
|
|
|
|
|
7.05.2004, 16:40:31
Post
#4
|
|
|
Grupa: Zarejestrowani Postów: 339 Pomógł: 0 Dołączył: 17.06.2003 Skąd: Białystok Ostrzeżenie: (0%)
|
Cytat Ale wszystkie te divy trzeba najpierw gdzieś umieścić, aby można było je później przesuwać. Nie wiem jak ja mam znaleźć miejsce na kilkanaście pozycji menu.
Hmm... trudno o dokladna porade bo nie widac jak to wyszstko myglada a jak ma wygladac i jaki jest kod. Ale generalnie moge napisac, ze kazdy element mozna relatywnie spozycjonowac, poniewaz kazdy ma spojego rodzica (oprocz root-elementu jednak on i tak sie nie pozycjonuje z definicji). -------------------- |
|
|
|
|
7.05.2004, 19:22:24
Post
#5
|
|
|
Grupa: Zarejestrowani Postów: 222 Pomógł: 0 Dołączył: 3.04.2003 Skąd: Wrocław Ostrzeżenie: (0%)
|
Można wszystkie elementy takiego menu umieścić relatywnie?
-------------------- pozdrawiam, chfast
|
|
|
|
|
7.05.2004, 20:16:00
Post
#6
|
|
|
Grupa: Zarejestrowani Postów: 339 Pomógł: 0 Dołączył: 17.06.2003 Skąd: Białystok Ostrzeżenie: (0%)
|
Cytat Można wszystkie elementy takiego menu umieścić relatywnie?
Moze nie specjalnie sie przyjrzalem ale na samej stronie nie ma specjalnie pozycjownowania absolutniego (jedynie jest tam gdzie sa znaczniki <noscript> ktore i tak generalnie nie sa wyswietlane przez przegladarki - niejako pomijane) za pomoca CSS ale z drugiej strony kod JS odpowiedzialny za poszczegolne elementy moze w tym aspekcie ingerowac (nie wglebialem sie w pod, poniewaz jest perfidnie dlugi i nie specjalnie czuje sie na sialch modyfikowania czyjegos skomplikowanego kodu), Wiem, ze pewnie nie to chcesz uslyszec ale ja bym nie przesadzal akurat z tym skryptem i napisal sam (lub wziol) cos znacznie czytelniejszego i mniej skomplikowanego, nawet powiedzmy cos co jest oparte o same CSS (bo mozna i dosyc podobne menu zrobic w CSS-ach nie uzywajac JS, co z drugiej strony tez nie jest rozwiazaniem bo IE tego nie wyswietli). -------------------- |
|
|
|
|
7.05.2004, 21:02:40
Post
#7
|
|
|
Grupa: Zarejestrowani Postów: 222 Pomógł: 0 Dołączył: 3.04.2003 Skąd: Wrocław Ostrzeżenie: (0%)
|
Dobra, ostatecznie zdecydowałem się na Tigra Menu. Kod tego menu generuje dwa znaczniki dla każdego elementu: a i div. Nie wiem dokładnie co jest wrzucane do znacznika div, bo kod menu jest bardzo skompresowany i ciężko zakumać co się skąd bierze.
[xml:1:1eb3899d28]... document.write( '<a id="e..o" class=".." href=".." target=".." style="position: absolute; top: ..px; width: ..px; height: ..px; visibility: hidden; z-index: ..;" onclick=".." onmouseout=".." onmouseover=".." onmousedown=".."> <div id="e..i" class="..">..</div></a>');[/xml:1:1eb3899d28] Co by nie było w tym skrypcie to zasada działa nia jest prosta: każdy element jest umieszczany absolutnie, a jego pozycja jest obliczana przez skrypt w odniesieniu do elementu nadrzędnego. -------------------- pozdrawiam, chfast
|
|
|
|
|
7.05.2004, 21:10:42
Post
#8
|
|
|
Grupa: Zarejestrowani Postów: 339 Pomógł: 0 Dołączył: 17.06.2003 Skąd: Białystok Ostrzeżenie: (0%)
|
Cytat Co by nie było w tym skrypcie to zasada działa nia jest prosta: każdy element jest umieszczany absolutnie, a jego pozycja jest obliczana przez skrypt w odniesieniu do elementu nadrzędnego.
No to w taki sposob napewno nie sprowadzi sie do zmany slowka absolute na relative + ewentualnie inne szczegoly. Trzaba przetobic skrypt (o ile sie da). -------------------- |
|
|
|
|
8.05.2004, 10:06:50
Post
#9
|
|
|
Grupa: Zarejestrowani Postów: 222 Pomógł: 0 Dołączył: 3.04.2003 Skąd: Wrocław Ostrzeżenie: (0%)
|
Dzięki Dominik za wszelką pomoc. Ja popróbuje się pobawić z tym relative, ale powiedz mi jedno: czy istnieje jakikolwiek sposób, żeby pozycja absolutna odnosiła się do elementu nadrzędnego, ale innego niż body?
-------------------- pozdrawiam, chfast
|
|
|
|
|
8.05.2004, 11:52:39
Post
#10
|
|
|
Grupa: Zarejestrowani Postów: 222 Pomógł: 0 Dołączył: 3.04.2003 Skąd: Wrocław Ostrzeżenie: (0%)
|
Chyba znalazłem sposób, żeby zaczepić element w pozycji absolute do innego elementu. Działa na Mozilli, IE 5.5 i Operze 7.23.
[xml:1:a1ed69e1b2]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Absolute</title> <style type="text/css"> /*<![CDATA[*/ #b { border: 1px solid #0a0; height: 200px; padding: 20px;} #before, #after { width: 100px; background: #fdf; float: left; } #main { width: 300px; height: 200px; float: left; background: #ffd; border: 1px solid #f00; } #main div { position: absolute; } #menu { width: 160px; height: 120px; border: 1px solid #f00; background: #fcc; left: 30px; top: 10px; } /*]]>*/ </style> </head> <body> <div id="b"> <div id="before">before</div> <div id="main"> <div> <div id="menu">DIV<br/>position: absolute;<br/>left: 30px;<br/>top: 10px;</div> </div> </div> <div id="after">after</div> </div> </body> </html> [/xml:1:a1ed69e1b2] -------------------- pozdrawiam, chfast
|
|
|
|
 |
|
Wersja Lo-Fi | Aktualny czas: 31.07.2025 - 07:23 |
