Søg
Avatar billede triple-x Nybegynder
23. oktober 2004 - 22:46 Der er 23 kommentarer og
1 løsning

HTML/js problem

Hey Eksperter,

Jeg ved ikke helt hvordan jeg skal beksrive problemet da det drejer sig om et par filer og lign.
Men hvis man kigger på www.designstroke.dk/fixide/ så vil menuen ikke fungere som en dropdown, dog er alt koden iorden (så vidt jeg kan se)
hvis man issolere menuen i sin egen html som her:
www.designstroke.dk/fixide/test/ så er det intet problem.

er der nogen der kan knække den?

På forhånd tak.
Avatar billede skovenborg Nybegynder
23. oktober 2004 - 23:35 #1
for det første har du en fejl i dit preload-script. Du har først og fremmest skrevet newImage istedet for new Image, som det hedder. Desuden bruger du argumentet i new Image() til at definere dit billedes url. Det er dog ikke helt korrekt, for de argumenter du kan bruge i new Image() er kun bredden og højden af billedet. I stedet skal du skrive:
pre_menu1_r = new Image();
pre_menu1_r.src = 'images/menu1_r.gif';

derfor bliver din funktion til:
var preloadFlag = false;
function preloadImages() {
    if (document.images) {
        pre_menu1_r = new Image();
        pre_menu1_r.src = 'images/menu1_r.gif';
        pre_menu2_r = new Image();
        pre_menu2_r.src = 'images/menu2_r.gif';
        pre_menu4_r = new Image();
        pre_menu4_r.src = 'images/menu4_r.gif';
        pre_menu3_r = new Image();
        pre_menu3_r.src = 'images/menu3_r.gif';
        pre_menu5_r = new Image();
        pre_menu5_r.src = 'images/menu5_r.gif';
        pre_menu6_r = new Image();
        pre_menu6_r.src = 'images/menu6_r.gif';
        preloadFlag = true;
    }
}


Og så til det næste problem. Hvis du prøver at rette denne fejl vil du samtidig opdage at dine undermenuer ikke bliver placeret rigtigt. Dette skyldes at din offsetLeft og offsetTop i funktionen dropdown.showMenu = function() tager positionen fra venstre og toppen af den omkransende celle som menuen ligger i og ikke hele siden som det er tilfældet i din test-side.
Heldigvis har en bruger her på eksperten (jumper var det vist), lavet en funktion til at beregne den rigtige position. Med den i baghånden kan vi rette den anden lille fejl:
    dropdown.showMenu = function() {
        pos = getPos(this);
        menu.style.left = pos.x + "px";
        menu.style.top = pos.y + this.offsetHeight + "px";
        menu.style.visibility = "visible";
        currentMenu = menu;
    }
}
function getPos(elm) {
    for(var zx=zy=0;elm!=null;zx+=elm.offsetLeft,zy+=elm.offsetTop,elm=elm.offsetParent);
    return {x:zx,y:zy}
}
Avatar billede triple-x Nybegynder
23. oktober 2004 - 23:38 #2
du er da også overalt her til aften :)
jeg prøver at rette de ting du siger.
Avatar billede voirsous Nybegynder
23. oktober 2004 - 23:39 #3
har du prøvet at gå den anden vej, ved at pille koderne ud af din side lidt af lidt indtil det virker, og så se om du kan finde fjeln på den måde?

Menuen gemmer sig ikke bag din tabel eller sådan noget?
Avatar billede triple-x Nybegynder
23. oktober 2004 - 23:42 #4
voirsous - nej det mener jeg at have testet :) præver lige at rette de ting som skovenborg har påpeget, det kan være det løser problemet.
Avatar billede triple-x Nybegynder
23. oktober 2004 - 23:48 #5
www.designstroke.dk/fixide/js/menuDropdown.js
www.designstroke.dk/fixide/

det ser desværre ikke ud til at virke, har fjernet alt under menuen så jeg var sikker på den ikke blev skjult under det andet.
Avatar billede skovenborg Nybegynder
24. oktober 2004 - 00:04 #6
det også rigtigt - glemte lidt endnu:
function initMenu() {
            initializeMenu("husMenu", "husdropdown");
            initializeMenu("HaveMenu", "Havedropdown");
            initializeMenu("BlomsterMenu", "Blomsterdropdown");
            initializeMenu("IndretningMenu", "Indretningdropdown");
            initializeMenu("handvarkerMenu", "handvarkerdropdown");
        }

<body onload="preloadImages();initMenu()">

En onload-event i body-tagget overgår åbenbart window.onload - derfor ;-)
Avatar billede triple-x Nybegynder
24. oktober 2004 - 00:07 #7
okay, det prøver jeg lige :)
Avatar billede triple-x Nybegynder
24. oktober 2004 - 00:15 #8
så skal jeg også have et svar fra dig her, for det virker perfekt, mange mange tak. det har været en super hjælp.
Avatar billede skovenborg Nybegynder
24. oktober 2004 - 00:17 #9
jamen du er velkommen :-)
Avatar billede triple-x Nybegynder
24. oktober 2004 - 00:20 #10
jeg bukker og takker endnu en gang.
Avatar billede skovenborg Nybegynder
24. oktober 2004 - 00:25 #11
og jeg takker for point - to gange :-)
Avatar billede triple-x Nybegynder
24. oktober 2004 - 00:51 #12
hehe det var så lidt :) skulle det være en anden gang
Avatar billede triple-x Nybegynder
24. oktober 2004 - 01:05 #13
har lige et lille bonus spørgsmål hvis du kan klare det:
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.designstroke.dk%2Ffixide%2F&charset=%28detect+automatically%29&doctype=%28detect+automatically%29

jeg kan simpelt hen ik få den væk.
www.designstroke.dk/fixide/
Avatar billede triple-x Nybegynder
24. oktober 2004 - 10:41 #14
problemet var at man ikke kan ha en ul uden en li i desværre, men det var løsningen på det.
Avatar billede skovenborg Nybegynder
24. oktober 2004 - 18:30 #15
Du har også et par fejl mere i linie 283:
    <table>
</table>
Slet det første <table> her.
Avatar billede triple-x Nybegynder
24. oktober 2004 - 18:33 #16
skovenborg - mange tak :)

har lige en anden ting. som du kan se så virker menuen ikke alt for godt endnu plus jeg ville gerne have den til at kunne lave menuknapper hvor der ikke er dropdown, er dette en meget stor sag eller er det noget du vil kunne klare hvis jeg opretter et nyt spørgsmål?
Avatar billede skovenborg Nybegynder
24. oktober 2004 - 18:49 #17
det første problem med menuen kan umiddelbart løses ved at slette den anden dropdown.onmouseover og sætte noget af den sammen med den første, så der kun står:
dropdown.onmouseover = function() {
        if (currentMenu) {
            currentMenu.style.visibility = "hidden";
            this.showMenu();
        }
    else {
        this.showMenu();
    }
    }
Avatar billede triple-x Nybegynder
24. oktober 2004 - 18:54 #18
sådan her, jeg er ikke helt med hvilket der skal slettes og hvor det nye skal ind

var currentMenu = null;

if (!document.getElementById)
    document.getElementById = function() { return null; }

var currentMenu = null;

if (!document.getElementById)
    document.getElementById = function() { return null; }

function initializeMenu(menuId, dropdownId) {
var menu = document.getElementById(menuId);
    var dropdown = document.getElementById(dropdownId);
    menu.onmouseover = function() {
        this.style.visibility = "visible";
        currentMenu = this;
    }
    menu.onmouseout = function() {
        this.style.visibility = "hidden";
        currentMenu = null;
    }
    if (menu == null || dropdown == null) return;

dropdown.onmouseover = function() {
        if (currentMenu) {
            currentMenu.style.visibility = "hidden";
            this.showMenu();
        }
    else {
        this.showMenu();
    }
    }
        else {
            currentMenu.style.visibility = "hidden";
            currentMenu = null;
        }

        return false;
    }

dropdown.showMenu = function() {
        pos = getPos(this);
        menu.style.left = pos.x + "px";
        menu.style.top = pos.y + this.offsetHeight + "px";
        menu.style.visibility = "visible";
        currentMenu = menu;
    }
}
function getPos(elm) {
    for(var zx=zy=0;elm!=null;zx+=elm.offsetLeft,zy+=elm.offsetTop,elm=elm.offsetParent);
    return {x:zx,y:zy}
}
Avatar billede skovenborg Nybegynder
24. oktober 2004 - 18:56 #19
næh, alt det her:
dropdown.onmouseover = function() {
        if (currentMenu) {
            currentMenu.style.visibility = "hidden";
            this.showMenu();
        }
    else {
        this.showMenu();
    }
    }
        else {
            currentMenu.style.visibility = "hidden";
            currentMenu = null;
        }

        return false;
    }

skal kortes ned til:
dropdown.onmouseover = function() {
        if (currentMenu) {
            currentMenu.style.visibility = "hidden";
            this.showMenu();
        }
    else {
        this.showMenu();
    }
    }
Avatar billede skovenborg Nybegynder
24. oktober 2004 - 18:58 #20
forresten kan det andet problem løses ved at lave en lille ny funktion til tomme dropdowns:
function initializeMenuPunkt(dropdownId) {
    elm = document.getElementById(dropdownId);
    elm.onmouseover = function() {
        currentMenu.style.visibility = "hidden";
        currentMenu = null;
    }
}

Sættes bare efter getPos funktionen. Så kan du i HTML-koden skrive:
<li class="menubar"><a href="#" id="ingendropdown" class="dropdown">Link</a></li>
...
<li class="menubar"><a href="#" id="husdropdown" class="dropdown" accesskey="p">Hus</a>

og til sidst der hvor du laver dropdown-menuerne:
function initMenu() {
            initializeMenu("husMenu", "husdropdown");
            initializeMenu("HaveMenu", "Havedropdown");
            initializeMenu("BlomsterMenu", "Blomsterdropdown");
            initializeMenu("IndretningMenu", "Indretningdropdown");
            initializeMenu("handvarkerMenu", "handvarkerdropdown");
        initializeMenuPunkt("ingendropdown");
        }
Avatar billede triple-x Nybegynder
24. oktober 2004 - 18:59 #21
Det virker, men opretter nu lige et spørgsmål mere så du kan få nogle point.
Avatar billede triple-x Nybegynder
24. oktober 2004 - 19:02 #22
okay har ikke lige prøvet det sidste, det prøver jeg lige
Avatar billede triple-x Nybegynder
24. oktober 2004 - 19:13 #23
det virker bare helt perfekt. det kan jeg ikke takke dig nok for, opretter et spørgsmål her i kategorien med 100 point til dig.
Avatar billede triple-x Nybegynder
24. oktober 2004 - 19:14 #24
http://www.eksperten.dk/spm/554016
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 19:46 Skift fra Microsoft365 til Microsoft 2024 Af 1Dorte i Office & Kontorpakker
18/0816:51 Links m.m. virker ikke Af Kjeld Aage Christiansen i PC
18/0811:04 Outlookproblem Af g91 i E-mail programmer
18/0809:21 Firefox - Bøvl med idelig genbekræftelse af identitet Af andershl i Browsere
17/0815:14 Sætte billeder ind i google sheets ark ud fra elev nummer Af lurup i Excel
White papers
Flere white papers »