Søg
Avatar billede ngr Praktikant
29. august 2002 - 16:28 Der er 10 kommentarer og
1 løsning

To billeder i to lag

Jeg har fået det gode råd at bruge koden herunder til at anbrnge to billeder i 2 lag. Det virker også godt nok, men når jeg lægger dem ind i en tabel, kan jeg se, at de optager en masse plads til højre for billederne - altså der hvor der ingen billeder er at se. Kan man ikke gøre noget ved det.

<img src="pics/kort-lille.gif"><img src="pics/1.gif" style="position: relative; left: -254px; top: -55px">
Avatar billede sthen Nybegynder
29. august 2002 - 16:33 #1
<img src="pics/kort-lille.gif" WIDTH="XXX" HEIGHT="XXX">
<img src="pics/1.gif" WIDTH="XXX" HEIGHT="XXX" style="position: relative; left: -254px; top: -55px">

Hvor XXX er pixel-målet på dine billeder.
Avatar billede sthen Nybegynder
29. august 2002 - 16:35 #2
Endelig bør du vel også sætte forskellige z-index værdier på, for at angive hvilket billede der ligger øverst/nederst
Avatar billede Slettet bruger
29. august 2002 - 17:52 #3
Det er formentlig fordi, at browseren reserverer pladsen for billedet, der er placeret relativt. Og så må vi jo finde en alternativ løsning:

<script>
function findPosX(obj)
{

    var curleft = 0;
    if (document.getElementById || document.all)
    {
        while (obj.offsetParent)
        {
            curleft += obj.offsetLeft
            obj = obj.offsetParent;
        }
    }
    else if (document.layers)
        curleft += obj.x;
    return curleft;
}

function findPosY(obj)
{
    var curtop = 0;
    if (document.getElementById || document.all)
    {
        while (obj.offsetParent)
        {
            curtop += obj.offsetTop
            obj = obj.offsetParent;
        }
    }
    else if (document.layers)
        curtop += obj.y;
    return curtop;
}

function paaPlads() {
if (document.getElementById) {
document.getElementById("billede2").style.left = findPosX(document.getElementById("billede1"));
document.getElementById("billede2").style.top = findPosY(document.getElementById("billede1"));
}
else if (document.all) {
document.all.billede2.style.left = findPosX(document.all.billede1);
document.all.billede2.style.top = findPosY(document.all.billede1);
}
else if (document.layers) {
document.billede2.left = findPosX(document.billede1);
document.billede2.top = findPosY(document.billede1);
}
}
</script>

I <body>-tagget:

<body onLoad="paaPlads();">

Og til sidst dine to billeder:

<img src="pics/kort_lille.gif" id="billede1">
<img src="pics/1.gif" id="billede2" style="position: absolute; top: -300px; left: -300px;">
Avatar billede ngr Praktikant
29. august 2002 - 18:23 #4
gisp, det var en ordentlig smøre, som jeg ike forstår meget af.
Men jeg kan se at der bruges absolut position, og den går ikke, jeg er nødt til at bruge relativ position.
Men ellers er sthens løsning jo charmerende kort - er den ikke lisså god?
Avatar billede ngr Praktikant
29. august 2002 - 20:12 #5
Nu har jeg prøvet koden herunder. Nu lægges der ikke beslag på pladsen tilhøjre for billederne - men i stedet pladsen under........

<img src="pics/kort-lille.gif" WIDTH="300" HEIGHT="263">
<img src="pics/1.gif" WIDTH="209" HEIGHT="197" style="position: relative; left: -0px; top: -255px">
Avatar billede Slettet bruger
30. august 2002 - 13:28 #6
ngr>> Scriptet sørger automatisk for, at billedet ligger oven på det andet billede. Du skal ikke selv angive nogen som helst værdier.
Avatar billede Slettet bruger
30. august 2002 - 13:28 #7
Og en anden gang bør du nok i det mindste prøve scriptet, før du afviser det.
Avatar billede ngr Praktikant
31. august 2002 - 17:06 #8
Hvorfor står der så 300px; left: -300px
Avatar billede Slettet bruger
01. september 2002 - 14:23 #9
Fordi jeg vil placere billedet udenfor synsfeltet, indtil det andet billede er loadet. For først dér kan man aflæse dets position.
Avatar billede Slettet bruger
20. januar 2003 - 14:45 #10
Selv tak.
Avatar billede ngr Praktikant
23. april 2010 - 01:06 #11
.
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 16:15 Internet forsvinder hele tiden Af TTA i Internetforbindelser
23/0920:49 Fejl på Tv2 Play Af Bukse i Browsere
23/0918:11 VB, Lægge 2 celler sammen og skrive den i cellen ved side af Af MC3390 i Excel
21/0910:39 DBA er ikke hvad det tidligere var - desværre! Af ErikHg i Fri debat
18/0919:52 Libre office skriveprogram Af Frank i Office & Kontorpakker
White papers
Flere white papers »