/ Forside / Teknologi / Multimedie & design / FrontPage / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
FrontPage
#NavnPoint
molokyle 3730
bentjuul 3355
BjarneD 2776
dk 1515
emesen 1490
strarup 1480
catbody 1241
brokke44 1160
er_du_klog 1052
10  PARKENSS 1050
Folde-ud-menuer
Fra : Jørgen Grandt


Dato : 12-01-05 12:34

Der har givet været spurgt før; men jeg finder ikke svaret i de seneste
knapt 600 tråde ...

Hvordan laver man folde-ud-menuer i FP2003? Og/eller hedder de i
virkeligheden noget andet? Altså den slags som man ser foroven på
http://www.aarhus.dk/aa/portal/borger
og på tonsvis af andre websteder.

Mvh.: Jørgen Grandt



 
 
ha (12-01-2005)
Kommentar
Fra : ha


Dato : 12-01-05 12:46

Jørgen Grandt wrote:
> Hvordan laver man folde-ud-menuer i FP2003? Og/eller hedder de i
> virkeligheden noget andet?

Der er sikkert Drop down.

Se iøvrigt
http://groups.google.dk/groups?hl=da&lr=&q=drop+down+menu&btnG=S%C3%B8g&meta=group%3Ddk.edb.internet.webdesign.frontpage

/ha



Jørgen Graae Jensen (12-01-2005)
Kommentar
Fra : Jørgen Graae Jensen


Dato : 12-01-05 16:54

> Hvordan laver man folde-ud-menuer i FP2003? Og/eller hedder de i
> virkeligheden noget andet? Altså den slags som man ser foroven på
> http://www.aarhus.dk/aa/portal/borger
> og på tonsvis af andre websteder.

Prøv at se denne tråd:
http://www.dynamicdrive.com/dynamicindex1/index.html


--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Viggo (12-01-2005)
Kommentar
Fra : Viggo


Dato : 12-01-05 18:19


"Jørgen Grandt" <UnstableOn@Cable.dk> skrev i en meddelelse
news:41e50b03$0$167$edfadb0f@dread11.news.tele.dk...
> Der har givet været spurgt før; men jeg finder ikke svaret i de seneste
> knapt 600 tråde ...
>
> Hvordan laver man folde-ud-menuer i FP2003? Og/eller hedder de i
> virkeligheden noget andet? Altså den slags som man ser foroven på
> http://www.aarhus.dk/aa/portal/borger
> og på tonsvis af andre websteder.
>
> Mvh.: Jørgen Grandt
>
Formater / Opførsel / Indsæt / Rulleliste
Jeg fungerer fint for mig på www.vboller.dk

--


Vh
Viggo
Slet "fjern" fra adressen



Jørgen Grandt (12-01-2005)
Kommentar
Fra : Jørgen Grandt


Dato : 12-01-05 20:36

Viggo skrev:

> "Jørgen Grandt" <UnstableOn@Cable.dk> skrev i en meddelelse

>> Hvordan laver man folde-ud-menuer i FP2003? Og/eller hedder de i
>> virkeligheden noget andet? Altså den slags som man ser foroven på
>> http://www.aarhus.dk/aa/portal/borger
>> og på tonsvis af andre websteder.

> Formater / Opførsel / Indsæt / Rulleliste
> Jeg fungerer fint for mig på www.vboller.dk

Tak - men det er ikke sådan en rulleliste jeg er ude efter. Det er derimod
den slags som ses øverst her: http://www.aakb.dk/ - altså menuer / links
som åbner sig automatisk blot man peger med musen, og hvorefter man så
vælger en af de muligheder som viser sig.

Men det kan måske sletg ikke laves i FP2003 uden tilførsel af forskelligt
HTML-fikumdik?

Mvh.: Jørgen Grandt



Ukendt (14-01-2005)
Kommentar
Fra : Ukendt


Dato : 14-01-05 19:44


"Jørgen Grandt" <UnstableOn@Cable.dk> skrev i en meddelelse
news:41e57bfb$0$177$edfadb0f@dread11.news.tele.dk...
> Tak - men det er ikke sådan en rulleliste jeg er ude efter. Det er derimod
> den slags som ses øverst her: http://www.aakb.dk/ - altså menuer / links
> som åbner sig automatisk blot man peger med musen, og hvorefter man så
> vælger en af de muligheder som viser sig.
>
> Men det kan måske sletg ikke laves i FP2003 uden tilførsel af forskelligt
> HTML-fikumdik?

Jo - det kan godt lade sig gøre. FP 2003 er forsynet med en mængde nye
muligheder. Det er imidlertid ikke helt ligetil, da hele øvelsen går ud på
at FP skal fremstille en masse JavaScript koder i den rigtige rækkefølge.

Nedennævnt følger "et par sider" fra mit kursushæfte. Jeg skal gøre
opmærksom på, at nedennævnte opskrift virker i IE 6.0, og at der er nogle
positioneringsproblemer i Firefox, som ikke er løst. Jeg skal også gøre
opmærksom på, at jeg IKKE yder support på opskriften. Opskriften leveres til
afbenyttelse som den fremstår og brugeren må selv løse problemerne. Der er
ikke læst korrektur på opskriften, hvorfor man måske skal læse teksten
igennem et par gange visse steder.

Hvis man ikke kan klare skuffelsen over at det ikke virker når man har
siddet og knoklet i nogle timer, så lad være med at begynd! Til gengæld er
"YES" effekten helt ubeskrivelig, når det lykkes.

mvh
Ulrik
=============

Åbn en ny side
Giv den et navn og gem den
Klik Formater -> Lag
I højre side åbnes "Lagdelt" opgave panel
Klik på ikonet "Tegn lag" i panelet

Indsæt et lag ved hjælp af dette værktøj ved at tegne et lag fra øverste
venstre hjørne af siden i hele sidens bredde og det halve i højden

Klik inde i laget

Indsæt -> Interaktiv knap
Vælg typen Nederste kant 1, erstat Knaptekst med Forside

Indsæt yderligere 3 knapper efter samme fremgangsmåde og navngiv dem
Produkter, Support og Kontakt os

I Lagdelt opgavepanelet, højreklik på lag1 -> Redigér id og omdøb til
MainMenu
Højreklik igen på laget MainMenu -> Rediger Z-indeks og giv det værdien 3

Det indsatte lag skal nu have samme størrelse som de fire indsatte knapper.
Klik på rammen hvorefter der viser sig nogle resize punkter. Tag fat i det
nederste højre hjørne med musen og tilpas størrelsen til de fire knapper.

Du vil opdage, at et lag er absolut placeret, så du kan placere det hvor du
ønsker. Klik uden for laget, før musen ind over aget indtil den ændrer facon
til en markør med fire pile. Hold venstre museknap nede og du kan flytte
laget på siden.

Gem dit arbejde. FP oplyser dig om, at de integrerede (knap)billeder skal
gemmes. Klik på Skift mappe og vælg images mappen. Klik OK.

Du vil nu se, at FP gemmer alle disse (knap)billeder i samme mappe som den
fil du arbejder på. Markér alle billedfilerne og træk dem over i images
mappen.

Du har nu lavet det øverste lag af din menu og skal nu lave det
underliggende og tilhørende lag.

Klik i MainMenu i Lagdelt opgavepanel så det er markeret.
Indsæt -> Lag
Det nye lag indsættes oveni det første lag. Træk laget ud på siden. Klik
inde i laget.
Indsæt -> Interaktiv knap. Vælg typen Venstre kant 1. Erstat Knaptekst med
Software. Klik OK.
Indsæt linieskift (Shift+Enter)
Indsæt endnu en interaktiv knap og giv den teksten Hardware.
Resize laget, så højde og bredde matcher knapperne.

I Lagdelt opgavepanel giver du laget Id navn: ProdSubMenu

Du skal nu lave endnu en submenu. Højreklik på ProdSubMenu og vælg Kopier.
Indsæt kopien på siden. Giv den Id navnet: SupportSubMenu og udskift
knapteksterne med FAQ og Spørg. Dette lag skal også være et underliggende og
tilhørende lag til MainMenu. Marker i Lagdelt opgavepanel SupportSubMenu, og
træk det (med venstre museknap nede) op på MainMenu og slip museknappen.

Gem dit arbejde. FP oplyser dig om, at de integrerede filer skal gemmes.
Klik på Skift mappe og vælg images mappen. Klik OK.

Højreklik på ProdSubMenu, vælg Redigér Z-indeks og vælg 2. Gør det samme for
den anden submenu. Dermed vil submenuerne kunne rulle ned ovenover en tekst
der kan stå umiddelbart under MainMenu.

Hvis du placerer musemarkøren over MainMenu laget på siden, så musemarkøren
ændrer form til fire pile, kan du trække laget rundt på siden med musen (med
vensre museknap nede). Du vil opdage, at de to underlag følger med. De to
submenuer beholder altså deres relative position i forhold til hovedmenuen.

Nu skal menuerne placeres rigtigt.Træk ProdSubMenu laget op så det dækker
den nederste mørke kant i MainMenu knapperne så venstre kant står lige under
P i Produkter. Gør tilsvarende med den anden submenu.

Hvis du får problemer med at arbejde med lagene, så kan du vælge hvilket lag
du vil arbejde med ved at klikke på lagets navn i Lagdelt opgavepanel.

Nu skal det laves sådan, at når siden åbnes, kan man kun se MainMenu laget,
og når musen bevæges henover Produkter vises den tilhørende submenu. Denne
submenu skal kun være synlig så længe musen befinder sig på Produkter
knappen eller ProdSubMenu laget. Bevæges musen udenfor skal submenuen
forsvinde.

I Lagdelt opgavepanel højreklikkes på ProdSubMenu. Her kan du vælge mellem
tre slags synlighed, vælg Angiv synlighed: Skjult. Til vesntre for Z-indeks
tallet ses et øje, der er lukket. Udfor den anden submenu dobbeltklikker du
i "øjekolonnen" så der også her ses et lukket øje.

Gem dit arbejde. Se siden i en browser. Det eneste synlige er MainMenu. Nu
skal der tilføjes interaktivitet til menuen.

I Lagdelt opgavepanel hvor der står Lagdelt klikker du i samme linie på
pilen ved siden af krydset og vælger Opførsel.

Marker Produkter knappen, klik på Indsæt og vælg Skift egenskab. I denne
dialogbox sætter du prik i Vælg element og her vælges div og ProdSubmenu og
der klikkes på Synlighed... og der vælges Synlig. Klik OK nogle gange. I
Opførsel opgavepanel ændres onclick til onmouseover.

Gå tilbage til Lagdelt og marker laget ProdSubMenu (i panelet til højre).
Klik igen frem til Opførsel og her klikkes Indsæt, Skift egenskab og i
dialogboxen klikkes på Synlighed... og her sættes prik ved skjult. Klik OK
nogle gange.

OBS. Hver gang dialogboxen Skift egenskab forlades, skal det sikres, at der
ikke er sat hak i boxen: Gendan, når musen flyttes.

I Opførsel opgavepanelet ændres onclick til onmouseout.

Vi er ikke færdige endnu, hvilket en test vil vise!

Marker Software knappen, klik Indsæt, Skift egenskab. I dialogboxen sættes
prik i Vælg element og her vælges div og ProdSubMenu og der klikkes på
Synlighed... og her sættes prik ved Synlig.

Dette gentages for Hardwareknappen.

Hele proceduren for ProdSubMenu laget med knapper gentages for
SupportSubMenu laget med knapper.

Vi er ikke færdige endnu, hvilket en test vil vise.

Forside knappen markeres, i Opførsel opgavepanelet klikkes Indsæt og der
vælges Skift egenskab, sæt prik i Vælg element, vælg div og ProdSubMenu og
klik på Synlighed... og sæt prik ved Skjult. Klik OK nogle gange. I Opførsel
panelet ændres onclick til onmouseover.

Gentag dette på Forside knappen for SupportSubMenu.

Gentag hele handlingen for Forside knappen på Kontakt os knappen.

Nu er der kun tilbage at få submenuen til Produkter til at blive usynlig,
når musen glider fra Produkter over på Support og vise versa.

Marker knappen Produkter, i Opførsel opgavepanelet klikkes Indsæt, vælg
Skift egenskab, sæt prik i Vælg element, vælg div og SupportSubMenu og klik
på Synlighed... og sæt prik i Skjult. Klik OK et par gange. I Opførsel
panelet ændres onclick til onmouseout.

Marker knappen Support, i Opførsel opgavepanelet klikkes Indsæt, vælg Skift
egenskab, sæt prik i Vælg element, vælg div og ProdSubMenu og klik på
Synlighed... og sæt prik i Skjult. Klik OK et par gange. I Opførsel panelet
ændres onclick til onmouseout.

Gem dit arbejde og test i en browser.

Tilføjelse af links til knapperne burde være enkelt: Dobbeltklik på knappen
og indsæt linket.

Denne side kan genbruges i et menusystem. Gem siden i en mappe kaldet _menu.
Når man sætter _ foran et mappenavn, vil denne mappe ikke fremtræde i
forskellige oversigter og søgninger, som FP kan lave. Siden kan så indsættes
på de sider man ønsker ved at vælge en webkomponent som Indsæt medtaget
indhold -> Side. Den kan også indgå i en dynamisk webskabelon.

Man kan selvfølgelig kun bruge de funktioner i FP man kender, så man slipper
ikke udenom at bruge noget tid på at sætte sig ind i de mange funktioner,
hvis man vil have det fulde udbytte af FP.

==========================













Søg
Reklame
Statistik
Spørgsmål : 177495
Tips : 31968
Nyheder : 719565
Indlæg : 6408489
Brugere : 218886

Månedens bedste
Årets bedste
Sidste års bedste