Avatar billede monie Nybegynder
17. februar 2004 - 10:27 Der er 22 kommentarer og
1 løsning

Faldned menu vertikalt hvordan?

På min hjemmeside www.sunwind.dk som jeg privat har
Ønsker jeg, at lave forsiden som -faldned menu vertikal.
Jeg har opbygget min hjemmeside med FontPage 2003 og syndte nu den den skal opfriskes.

Tænker på noget i retning af Stifinder fra windows.
Med 2 vinduer, hvor venstre skal indhold mapperne og i højere vindue skal vises emnet.

Eksemplet som venstre vindue ønskes:

mhaList som faldned menu vertikalt
Se: http://users.cybercity.dk/~dsl58854/articles/mhaList/example4.html

Har prøvet. Men hvordan skal mhalist.css og mhalist.js indrages.

Har ikke de store erfaringer med koder uden for FrontPage, derfor om du kunne hjælpe med
et praktisk eksempel på hvordan dette kunne laves.
Meget gerne et begrænset kode, som der kan bygges vider på.

Evt. som kan likkes direkte ind på min forside, som jeg så kan arbejde vider med.
Mange gange skal der bare ligesom huld på det.

Jeg satser 60 point, på et eksempel - beskrevet hvordan og hvor det skal indskrives får at virke.

Måske en ny index.htm side jeg kan arbejde vider på.

Med venlig hilsen

Monie Jacobsen
E-mail: mjs at nypost dor dk
Avatar billede Kengun Praktikant
17. februar 2004 - 11:16 #1
Jeg ville først starte med at hente ned mhalist.css og mhalist.js. Det kan du gøre herfra: http://users.cybercity.dk/~dsl58854/articles/mhaList/mhalist.js - http://users.cybercity.dk/~dsl58854/articles/mhaList/mhalist.css . Dernest kan du hente ned kilden på http://users.cybercity.dk/~dsl58854/articles/mhaList/example4.html . Så bygger du videre på den. .css filen indeholder hvordan det hele skal se ud, farve, skriftstørrelse, etc. og denne filen kan du selv endre i (du kan bruge notepad) slig at det passer til dit site. .js filen indeholder selve javascriptet for at få det hele til at fungere, og normalt så skal du ik endre i denne. Håber dette var lidt hjælp på veien ;)
Avatar billede monie Nybegynder
17. februar 2004 - 11:24 #2
Har hentet mhalist.js- og mhalist.css de ligger i roden af hjemmesiden.
Men hvordan skal disse file kaldes fra exampel4.html der jo linker til konstruktører af menuen.
Avatar billede monie Nybegynder
17. februar 2004 - 11:29 #3
<html>
Hvor meget af dette skal værre med?

<head>
<meta http-equiv="Content-Language" content="da">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
</head>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Avatar billede monie Nybegynder
17. februar 2004 - 11:43 #4
Rammen omkring Menu1,2 og 3 hvordan fjernes denne?
Avatar billede Kengun Praktikant
17. februar 2004 - 12:35 #5
Ta med det hele fra nedenstående kode (der er ik noget det gør skade), lagre den som et html dokuemnt og legg den samme folder som de to andre file.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   
<html>
<head>
    <script src="mhalist.js" type="text/javascript"></script>
    <link href="mhalist.css" rel="stylesheet" type="text/css" />
    <title>mhaList</title>
</head>
<body>
    <h1>mhaList</h1>
    <h2>Menu - Horizontal</h2>
    <ul class="ListMenu vertical" id="menu2">
        <li><a href="#">Menu 1</a>
            <ul>
                <li><a href="#">Menu 1.1</a></li>
                <li><a href="#">Menu 1.2</a></li>
            </ul>
        </li>
        <li><a href="#">Menu 2</a>
            <ul>
                <li><a href="#">Menu 2.1</a>
                    <ul>
                        <li><a href="#">Menu 2.1.1</a></li>
                        <li><a href="#">Menu 2.1.2</a></li>
                    </ul>
                </li>
                <li><a href="#">Menu 2.2</a>
                    <ul>
                        <li><a href="#">Menu 2.2.1</a></li>
                        <li><a href="#">Menu 2.2.2</a>
                            <ul>
                                <li><a href="#">Menu 2.2.2.1</a></li>
                            </ul>
                        </li>
                        <li><a href="#">Menu 2.2.3</a></li>
                    </ul>
                </li>
                <li><a href="#">Menu 2.3</a></li>
                <li><a href="#">Menu 2.4</a></li>
            </ul>
        </li>
        <li><a href="#">Menu 3</a>
            <ul>
                <li><a href="#">Menu 3.1</a></li>
                <li><a href="#">Menu 3.2</a></li>
            </ul>
        </li>
    </ul>
    <script type="text/javascript"><!--
    // Does Namespace 'ml' exist
    if (typeof(ml) != "undefined") {
        // Build ListMenu by the id of the root ul element
        var oMenu2 = new ml.buildList("menu2");
    }
    //--></script>
    <div style="clear:left;"> </div>
</body>
</html>

Da jeg ikke er hjemme lige nu (har ik den nødvendige programvare lige nu) så kan jeg desverre ik finde ud af hvordan du fjerner den ramme omkring Menu1,2,3 men jeg vil give et tip å at der ligger noget kode i enten .css filen eller i .js filer hvor du kan tage bort rammen. Kig efter "border", "borderline" og talet 1. Talet 1 kan du måske sette til 0 og rammen vil da gå bort.
Avatar billede Kengun Praktikant
17. februar 2004 - 12:38 #6
Jeg ser nu at der er to steder der det står  border: 1px i filen mhalist.css. Forsøg at endre det til  border: 0px
Avatar billede monie Nybegynder
17. februar 2004 - 13:07 #7
Tak Kegun
Du får de 60 point.
Men må jeg lige stille 2 spørgsmål merer, Rammen omkring Menu1 Menu2 osv.
Hvordan kommer denne ramme væk?
Jeg har et bagrundsbillede på min index.htm side, derfor ønskes Menu1 Menu2 osv.
at de blev gjort transparens, kan dette lade sig gører.
Hvis jeg kan få løst desse sidset spørgsmål, har jeg ikke flerer.

På forhånden mange tak
Med venlig hilsen

Monie Jacobsen
Avatar billede Kengun Praktikant
17. februar 2004 - 13:16 #8
Angående den ramme omkring Menu1,2,3: Åbne filen mhalist.css (brug gerne notepad). Tryk CTRL+F (søg) og søg efter "border: 1px" (uden de "). Forandre "border: 1px" til "border: 0px" (igen uden de "). Jeg er ikke 100% sikker på at dette vil fungere, da jeg fremdeles ik kan teste det hele ud her. Måske de border: 1px er til noget andet end den Menu1,2,3 men du kan give det et forsøg.

Angående det baggrundsbillede så vil jeg tro at du kan lægge det ind via noget .css haløj. Jeg vil kigge på det....
Avatar billede Kengun Praktikant
17. februar 2004 - 13:21 #9
Fant lige noget her: http://www.w3.org/TR/CSS21/colors.html#propdef-background-image

Forsøg at sette dette in i den mhalist.css

body { background-image: url("dittbaggrundbilled.jpg") }
p { background-image: none }

Forandre "dittbaggrundbilled.jpg" til navnet på ditt baggrundbilled :)
Avatar billede Kengun Praktikant
17. februar 2004 - 13:25 #10
hmm, måske dette ikke gør den Menu1,2,3 transparent :( Er ik helt sikker på om det er muligt at gøre. Måske du kan gøre noget i den mhalist.js fil for at gøre de bokse transparente. Jeg kender desverre ik javascript nok til at hjælpe dig der :( Der kan også være en mulighed i den .css fil at sætte baggrunden på de bokse til "blank" istedet for at have en farve. Lidt svært at sige, når jeg ikke sidder ved min PC lige nu, så kunne jeg have forsøget mig frem.
Avatar billede monie Nybegynder
17. februar 2004 - 13:28 #11
Ok Kengun
Det var flot, tak skal du havde.
Har fået rammerne væk med dit tips.
Håber jeg sener, hvis det bliver nøvendig, at måtte stille dig et spørgsmål.
Nu vil jeg forsøge, at få background-image transparens.

Ha en god dag
Med venlig hilsen
Monie Jacobsen
Avatar billede monie Nybegynder
17. februar 2004 - 13:44 #12
Hej Kengun
Prøver lige på faldrebet, med et spørgsmål

Har rette denne body:

body { background-image: url("himmel.jpg") }
p { background-image: none }

Fundet dette i mhalist.css, men ved ikke hvordan det skal indsættes?

ListMenu li.hasSubs a {
    background-image: url("arrow_right.gif");
    background-position: right;
    background-repeat: no-repeat;
}
.ListMenu.horizontal li.hasSubs a {
    background-image: url("arrow_down.gif");
}
.ListMenu.horizontal ul li.hasSubs a {
    background-image: url("arrow_right.gif") ;
}
.ListMenu li.noSubs a, .ListMenu.horizontal ul li.noSubs a {
    background-image: none;

Tør næsten ikke at spører, håber det er ok
Med venlig hilsen
Monie Jacobsen
Avatar billede Kengun Praktikant
17. februar 2004 - 14:04 #13
Åbne din mhalist.css fil.

EFTER:

html, body {
    margin:0;padding:0;
    font:100% verdana;
}

....forsøg at sette ind følgende:

body { background-image: url("himmel.jpg") }
p { background-image: none }


Den koden du har fundet:

ListMenu li.hasSubs a {
    background-image: url("arrow_right.gif");
    background-position: right;
    background-repeat: no-repeat;
}
.ListMenu.horizontal li.hasSubs a {
    background-image: url("arrow_down.gif");
}
.ListMenu.horizontal ul li.hasSubs a {
    background-image: url("arrow_right.gif") ;
}
.ListMenu li.noSubs a, .ListMenu.horizontal ul li.noSubs a {
    background-image: none;

...ser ud til at være nogle pile eller noget som ligger en eller anden plads i dem Meny bokse. Men når den ik finder de file så kan vi ikke se de file. Du kan forsøge at finde, eller lave, en arrow_right.gif og arrow_down.gif og smide ind i samme folder og se hva der hender :)
Avatar billede Kengun Praktikant
17. februar 2004 - 14:06 #14
Avatar billede Kengun Praktikant
17. februar 2004 - 14:07 #15
han der Martin Hintzmann Andersen kunne gjort det hele lidt enklere for os, ved at smide alle de nødvendige file i en zipfil ;) *lol*
Avatar billede monie Nybegynder
17. februar 2004 - 14:19 #16
Hej Kengun
Det jælper ikke menu'en blev ikke transparent.
Men jeg vil ikke blive, med at holde dig hen.
Hvis du har løst, vil jeg selvfølge meget gerne havde din hjælp til løsning,
af dette problem.
Men nu giver jeg tig alså point'ene.

Forløblig mange tak for din hjælp1
Monie Jacobsen
Avatar billede Kengun Praktikant
17. februar 2004 - 14:26 #17
nej, de billeder vil ik gøre menu'en transparent. De "arrow" file er de pile der er i de menu-bokse. Der er måske noget kode der må laves om. Jeg vil forsøge at kigge på det når jeg kommer hjem. Eller så kan du måske smide en emajl afsted til Martin? Du finder hans emajladresse her: http://www.hintzmann.dk/
Avatar billede monie Nybegynder
17. februar 2004 - 14:31 #18
Men stigen til dem skal vel også angives?
Har nu arrow_right.gif og arrow_down.gif liggende i en mappe med navn "images"

Med venlig hilsen
Monie Jacobsen
Avatar billede Kengun Praktikant
17. februar 2004 - 14:40 #19
jeps, dem må ligge i samme mappe eller så må du forandre koden slig at den finder bilderne. Se den /images/ i koden neden.

ListMenu li.hasSubs a {
    background-image: url("/images/arrow_right.gif");
    background-position: right;
    background-repeat: no-repeat;
}
.ListMenu.horizontal li.hasSubs a {
    background-image: url("/images/arrow_down.gif");
}
.ListMenu.horizontal ul li.hasSubs a {
    background-image: url("/images/arrow_right.gif") ;
}
.ListMenu li.noSubs a, .ListMenu.horizontal ul li.noSubs a {
    background-image: none;
Avatar billede monie Nybegynder
17. februar 2004 - 14:52 #20
Jeg prøvlige med at ændre sti'erne.
Hvordan kan du fortælle mig alt dette, når du ikke lige sidder ved din egen computer.

Du må meget gerne kikke på dette med transparent, hvis du vil, da jeg vil havde
vanskelig med at forklarer mig rigtig. Er ikke så øvet!

Må jeg vende til bage lidt sener.

Med venlig hilsen
Monie Jacobsen
Avatar billede Kengun Praktikant
17. februar 2004 - 14:57 #21
Jeg sidder ved en PC, men ikke min PC :) På min PC har jeg diverse programmer der gør det enklere for mig at teste ud. Din forklaring ang. transparent er da god nok for mig :)
Avatar billede monie Nybegynder
17. februar 2004 - 15:09 #22
Det lyder fint kengun
At du vil kikke på problemmet med transparent.
Du kan lige få min E-mail: mjs at nypost dot dk - Dett for at undgå spam.

arrow_down.gif
arrow_right.gif
Dem ser jeg ikke noget til når menu'en køres.

Himlen som bagrund, der benyttes, kan du se på hjemmesiden www.sunwind.dk
Der er ca. 23000 om mdr. så hjemmesiden er meget besøgt.
Den handle om vedvarende energi- kilder solfanger solceller vindmøller mv.

Jeg får inge penge for dette, det er bare min store intresse.
Derfor er jeg meget ivrig for at få dette menu system til at kører.

Med venlig hilsen
Monie Jacobsen
Avatar billede monie Nybegynder
17. februar 2004 - 18:20 #23
Det er selvfølgelig kun Menu1, Menu2 og Menu3 -Teksten der skal kune ses.
Deres bagrund skal værer transparent.

Mvh
Monie Jacobsen
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Kurser inden for grundlæggende programmering

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester