[dhtml] Drop-down menu's goed positioneren

[Verwijderd]

Ik ben bezig met een project(je), waarbij ik een paar drop-down-menu's heb gemaakt. Werkt prima, alleen loop ik tegen een probleem aan:

ik had de site eerst met <div align="center"></div> uitgelijnd, maar op die manier kan ik de drop-down-menu's niet goed positioneren, dus ik heb het naar <div style="left:175px"></div> veranderd. Echter, op één resolutie ziet dit er dus netjes uit, op de andere lijkt het niet meer alsof de site gecentreerd is.

Menu doe ik zo:

code:

<div id="menu-home" style="position: absolute; margin-left: 176px; top: 169px; display:none;">test</div>

Iemand ideeën hoe ik die drop-down-menu's kan positioneren als ik <div align="center"></div> gebruik ?

[gvdh81]

Zoek eens op dynamic drive, www.dynamicdrive.com veel dhtml menutjes die allemaal getest zijn op diverse browsers. joep er daar 1tje, zit er zelfs 1 die cross browser, cross platform is en ook over meerdere frames werkt...

(slotje?)

[Hangloozz]

als elke div gecentreerd moet worden kun je dat met een CSS truukje oplossen:

HTML:

#divnaam{
        position: absolute;
        z-index: 10;
        left: 50%;
        width:200px;
        height:300px;
        margin-left: -100px;    
        margin-top: -0px;
        
    }

waarbij het belangrijkste is dat de margin-left de helft moet zijn van de div-breedte om gecentreerd uit te komen.

gvdh81 schreef op 09 December 2002 @ 10:52:


(slotje?)

onnodig?

[ Voor 15% gewijzigd door Hangloozz op 09-12-2002 11:01 ]

[drm]

Hangloozz:

HTML:

#divnaam{
        position: absolute;
        z-index: 10;
        left: 50%;
        width:200px;
        height:300px;
        margin-left: -100px;    
        margin-top: -0px;
        
    }

code:

s/divnaam/divid/

edit:

Wel goeie tip, overigens Werkt ook met verticaal centreren

[ Voor 13% gewijzigd door drm op 09-12-2002 11:09 ]

[Hangloozz]

drm schreef op 09 December 2002 @ 11:06:

[...]

code:

s/divnaam/divid/

:P</flauw>

mja, maar wel true

[henkleerssen]

http://www.dhtmlcentral.com/ en zoek op slidemenu... cross platform .. en uitgelijnde slide menuutjes.. wat wil je nog meer...

[drm]

henkleerssen:
http://www.dhtmlcentral.com/ en zoek op slidemenu... cross platform .. en uitgelijnde slide menuutjes.. wat wil je nog meer...

@ moeite met topic lezen

[henkleerssen]

waarom z-index 10 btw? zomaar?

[Hangloozz]

henkleerssen schreef op 09 December 2002 @ 11:11:
waarom z-index 10 btw? zomaar?

tis gewoon ff een gecopy/paste stukje, maak er van wat je wilt..
Tis alleen van belang als je meerder div's in je document hebt waarbij de volgorde van opstapeling telt.

Daarnaast snap ik niet dat het zelf klussen en uitvogelen en experimenteren niet gemotiveerd wordt..
gelijk al: dhtmlcentral, kijk daar doe dit, misschien is die jongen een heel eind en is dit het laatste struikelblok.
En dan wordt ie bestookt met zulke dingen, daar _heb_ je niets aan.
Nou ligt het ook wel aan het type vraag maar in dit geval vind ik het onzin.

[ Voor 38% gewijzigd door Hangloozz op 09-12-2002 11:33 ]

[Verwijderd]

Hela, ik heb dit dus wel zelf geschreven (ik wil er nl. wat van opsteken zodat ik deze kennis later ook nog eens kan gebruiken...) Tsja, ik weet ook wel dat je bij dhtmlcentral.com allerlei kant-en-klare zooi is te vinden, maar dat wil ik niet.... Zelf doen is leuker & leerzamer.

_{Dat was ff reageren op een paar mensen}

Hangloozz: idd, dit is mijn laatste struikelblok Mooi menu gemaakt, alles dbase-driven, alleen dat uitlijnen lukt dus niet Ik ga nu ff eraan klooien zodat ik eindelijk krijg wat ik wil

De hele site lijn ik dus uit met dat left: 50% en die left: -100px (of een andee waarde), en daarvandaan moet ik dus mijn drop-down-menu's gaan berekenen ? Of hoe zou je het doen ?

[ Voor 1% gewijzigd door Verwijderd op 09-12-2002 16:25 . Reden: teipvaut ]

[Verwijderd]

Hmm, zo misschien ?

HTML:

#menu {
     left: 50%
     margin-left: -200px
}

Totale table is 400px breed, dus -200px is de linkerkant toch ?

[ Voor 6% gewijzigd door Verwijderd op 09-12-2002 16:32 ]

[Verwijderd]

dan zul de tabel als nog in andere positie's staan met een andere resolutie's..

[Verwijderd]

Verwijderd schreef op 10 december 2002 @ 13:09:
dan zul de tabel als nog in andere positie's staan met een andere resolutie's..

Ja ok, maar wel gecentreerd, toch ? De breedte van de tabel die ik heb, blijft op alle resoluties hetzelfde, dus aan de hand daarvan kan ik mooi die menuutjes positioneren

Nu nog wachten totdat die mydomain.com DNS weer up komt

[Hangloozz]

Als je nou je hele site in een DIV plempt met die CSS properties is er nix meer aan het handje (tenzij je ergens absolute gepositioneerde div's hebt gebruikt )

HTML:

<body>
<div met left:50% en margin-left: -zoveel>

...hele site...

</div>
</body>

[ Voor 9% gewijzigd door Hangloozz op 11-12-2002 20:35 . Reden: oei, ouwe typo :+ ]

[henkleerssen]

Hangloozz schreef op 10 December 2002 @ 17:02:
Als je nou je hele site in een DIV plempt met die CSS properties is er nix meer aan het handje (tenzij je ergens absolute gepositioneerde div's hebt gebruikt )

HTML:

<body>
<div met left:505 en margin-left: -zoveel>

...hele site...

</div>
</body>

eeuh kan je dan ook met frames oplossen lijkt me.. ipv div's...

[Verwijderd]

edit:

zie Hangloozz hieronder

[ Voor 97% gewijzigd door Verwijderd op 10-12-2002 17:57 . Reden: alcoholpercentage: ]

[Hangloozz]

Verwijderd schreef op 10 December 2002 @ 17:19:
luister naar drm, lees de draad nou eens topicstarter werkt nu met frames en je kunt geen elementen over frames heen laten vallen

waar lees jij in hemelsnaam dat ie frames gebruikt

Ben je niet een tikje in de war met dit topic?

[ Voor 3% gewijzigd door Hangloozz op 10-12-2002 17:39 . Reden: kijkdichtheid ]

[Verwijderd]

Hangloozz schreef op 10 december 2002 @ 17:38:
[...]

waar lees jij in hemelsnaam dat ie frames gebruikt

Ben je niet een tikje in de war met dit topic?

/me is getting a bit frustrated...

ja daar was ik idd mee in de war

/me rukt utpkabel uit computer voordat hij nog meer fouten gaat maken

[Verwijderd]

Hangloozz schreef op 10 December 2002 @ 17:02:
Als je nou je hele site in een DIV plempt met die CSS properties is er nix meer aan het handje (tenzij je ergens absolute gepositioneerde div's hebt gebruikt )

HTML:

<body>
<div met left:505 en margin-left: -zoveel>

...hele site...

</div>
</body>

Ik heb dus absoluut gepositioneerde div's gebruikt Dat relative snap ik nog niet helemaal Maar ik ga ff kijken of het is gelukt (die left: 50% was trouwens een goede tip!)

[Verwijderd]

Whohoo! Het werkt

Ik was alleen vergeten om ook bij de menu's "left: 50%" toe te passen Maar nu werkt het Thx!

[Hangloozz]

you're welcome

_{weer een dhtml addict erbij}

[drm]

lekker dynamisch, statisch gecentreerde div's

[Hangloozz]

ehm, maar dat menuutje mag ik toch wel dhtml noemen?

tss, f0pc0dert

[drm]

[Verwijderd]

drm schreef op 10 December 2002 @ 21:16:
lekker dynamisch, statisch gecentreerde div's

Dynamisch: ja: die menu's zijn dbase-driven: lekker makkelijk

Hangloozz schreef op 10 December 2002 @ 20:40:
you're welcome

_{weer een dhtml addict erbij}

Dat dacht ik ook