Javascript: uitlezen style.top lukt me niet - Softwareontwikkeling

vrijdag 8 april 2005 23:59

Acties:

Verwijderd

Topicstarter

Hoi, het uitlezen van de positie dmv style.top van een DIV lukt me niet, ik kan de DIV wel een positie geven, maar uitlezen en verwerken lukt niet.

Wie weet hoe het moet?

Ik gebruik FireFox maar op IE werkt het ook niet.

mvg, 3830

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>GetPos</title>
    <style type="text/css">
        #div1 {
            display: block; 
            float: left; 
            position: absolute;
            top: 60px; 
            left: 60px;  
            border: 1px solid black;
        }
    </style>
    <script type="text/javascript">
        function GetPos()
        {   

            document.forms[0].test.value = parseInt(document.getElementById('div1').style.top);
            
            
        }
    </script>
</head>
<body>
    <form>
        <input type="text" name="test"  />
        <input type="button" value="dsfa" onclick="GetPos()" />
    </form>
    <div id="div1" >fsdfasdfsa</div>
</body>
</html>

[ Voor 17% gewijzigd door Verwijderd op 09-04-2005 00:07 ]

zaterdag 9 april 2005 00:17

Acties:

crisp

Devver

Pixelated

impliciete styles kan je niet direct uitlezen, hooguit met getComputedStyle of currentStyle. Wat jij echter nodig hebt is de offsetTop van je element

Intentionally left blank

zaterdag 9 april 2005 12:00

Acties:

Verwijderd

Topicstarter

Perfect! met

HTML:

1	document.forms[0].test.value = document.getElementById(idnav).offsetTop;

werkt het nu wel!
Wel stom je je niet gewoon top kan uitlezen en invoeren. Is er ergens een lijst met alle mogelijke properties?

zaterdag 9 april 2005 12:13

Acties:

Johnny

ondergewaardeerde internetguru

http://www.quirksmode.org/viewport/compatibility.html

Aan de inhoud van de bovenstaande tekst kunnen geen rechten worden ontleend, tenzij dit expliciet in dit bericht is verwoord.

zaterdag 9 april 2005 12:18

Acties:

crisp

Devver

Pixelated

Verwijderd schreef op zaterdag 09 april 2005 @ 12:00:
[...]
Wel stom je je niet gewoon top kan uitlezen en invoeren.[...]

Wat je niet expliciet opgeeft kan je ook niet expliciet uitlezen; als je inline CSS gebruikt kan je de style property wel uitvragen, evenals als je de style mbv javascript expliciet hebt gezet:

HTML:

<div id="foo" style="position:absolute;top:60px;"></div>
<script type="text/javascript">
alert(document.getElementById('foo').style.top; // 60px

document.getElementById('foo').style.left = '100px';
alert(document.getElementById('foo').style.left; // 100px
</script>

Met impliciete stylekenmerken heb je te maken met cascading rules en is er geen 1-op-1 releatie; je hebt dan altijd te maken met berekende styles, hence getComputedStyle (DOM) of currentStyle (IE).

Intentionally left blank