Avatar billede themepark Nybegynder
13. oktober 2003 - 12:30 Der er 10 kommentarer og
1 løsning

Problem med at få den RIGTIGE værdi af left og top for elementer

Se på følgende kode:

<HTML>
<HEAD>
<LINK HREF="Opsætning.css" REL="Stylesheet">
<TITLE></TITLE>
</HEAD>
<BODY>
<FORM>
<TABLE BORDER=1>
<TR>
<TD ALIGN="Center">
<INPUT TYPE="Text">
</TD>
<TD ALIGN="Center">
<INPUT TYPE="Text">
</TD>
</TR>
<TR>
<TD ALIGN="Center">
<INPUT TYPE="Text">
</TD>
<TD ALIGN="Center">
<INPUT TYPE="Text">
</TD>
</TR>
</TABLE>
</FORM>
<SCRIPT LANGUAGE="JavaScript">
var MaksimumStoerrelse=0
for (FeltTaeller=0;FeltTaeller<4;FeltTaeller++) {
    alert(document.forms[0].elements[FeltTaeller].offsetTop)
    alert(document.forms[0].elements[FeltTaeller].clientTop)
}
</SCRIPT>
</BODY>
</HTML>

Problemet er, at jeg får værdien 2 for både clientTop og offsetTop, og det kan jo ikke passe, da de 2 nederste celler er betydeligt længere nede end 2 pixels.

Såvidt jeg ved, skyldes det, at i hvert fald offsetTop tages i forhold til tabelcellen i dette tilfælde.

Men hvordan får jeg den rigtige top og left værdi, for de 4 INPUT felter?
Avatar billede olebole Juniormester
13. oktober 2003 - 12:42 #1
<ole>

function getPos(elm) {
    for(var zx=zy=0;elm!=null;zx+=elm.offsetLeft,zy+=elm.offsetTop,elm=elm.offsetParent);
    return {x:zx,y:zy}
}

var pos = getPos(document.forms[0].elements["FeltTaeller"]);
alert("Left: " + pos.x);
alert("Top: " + pos.y);

/mvh
</bole>
Avatar billede olebole Juniormester
13. oktober 2003 - 12:44 #2
Oooooops ... et par gåseøjne for meget:

var pos = getPos(document.forms[0].elements[FeltTaeller]);
Avatar billede themepark Nybegynder
13. oktober 2003 - 12:46 #3
Okay, det var vist ikke formuleret klart nok :)

Det der med at bruge en for tæller er noget jeg helst vil holde mig langt fra. Det jeg tænkte på er at der da for pokker må være en egenskab i JavaScript, der returnerer den rigtige left og height, altså den i forhold til vinduets kant, forstås.
Avatar billede olebole Juniormester
13. oktober 2003 - 13:18 #4
Nej, det er derfor, jeg har givet dig en enddog _yderst_ 'sexy', lille funktion til det  :)
/mvh
Avatar billede olebole Juniormester
13. oktober 2003 - 13:23 #5
PS: Årsagen er, at den rigtige top og left _ikke_ er den fra vinduets kant, men den fra det omsluttende elements kant.

Sætter du style="left:120px" på et element, er det ikke 120 pixels fra vinduets venstre kant, men det omsluttende elements venstre kant ... sådan er CSS nu engang indrettet  :)
/mvh
Avatar billede themepark Nybegynder
13. oktober 2003 - 15:17 #6
Hmmm...okay...mærkelig måde at lave tingene på. Men findes der andre lefts end clientLeft og offsetLeft?
Avatar billede olebole Juniormester
13. oktober 2003 - 15:30 #7
Det kan man vist kun finde mærkeligt, hvis hele idéen med CSS er fløjtet hen over hovedet på én  :)

Ja, der er også scrollLeft og pixelLeft (hvor den sidste er proprietært MS-skrammel), men der _er_ ikke noget, du kan bruge. Tro mig nu, kære ven  :)
Avatar billede themepark Nybegynder
13. oktober 2003 - 15:33 #8
Er der en ide med CSS? ;) Jamen jeg tror dig skam gerne, men der har vel aldrig været noget i vejen med at få lidt ekstra viden :) Og jeg har også tit opdaget herinde, at folk faktisk kan blive overraskede når de er sikre på de har ret ;)
Avatar billede olebole Juniormester
13. oktober 2003 - 15:35 #9
Ja, jeg bliver skam overrasket, hvergang jeg tager fejl  :)
Avatar billede olebole Juniormester
13. oktober 2003 - 15:55 #10
... takker  :)
Avatar billede roenving Novice
14. oktober 2003 - 04:46 #11
>>olebole 13/10-2003 15:35:28 *lol*
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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