[JS] Div popup verticaal centeren - Softwareontwikkeling

woensdag 6 september 2006 15:15

Acties:

Topicstarter

Hallo,

Ik heb een (goede) script gevonden voor een js/dhtml popup.
http://www.codeproject.co...ng_dimming_div.asp?df=100

Alleen als ik de popup activeer:

JavaScript:

    function displayWindow()
    {
        var w, h, l, t;
        w = 400;
        h = 200;
        l = screen.width/4;
        t = screen.height/4;
                
        displayFloatingDiv('windowcontent', 'Meer info', w, h, l, t);
    }

Dan komt hij bovenin de pagina te staan.

Ik wil hem echter dat hij recht voor je neus oppop, dus dat het niet uitmaakt hoe ver je naar beneden scrolt in de pagina.

Ik heb nu echt tijden zitten te zoeken.
Weten jullie misschien een oplossing ¿

Alvast bedankt,

Portfolio

woensdag 6 september 2006 15:20

Acties:

André

Analytics dude

Je moet dan de pageYOffset (FF) of scrollTop (IE) bij de t optellen

woensdag 6 september 2006 15:26

Acties:

Gurbe de n00b

Topicstarter

Hier heb ik zo lang naar gezocht

Ik ben niet zo'n Javascript guru

Bedankt

Edit:

Even een simpele testpagina gemaakt

Maar,
Als ik naar beneden scroll en ik fire daar een alertje dan krijg ik een 0 terug.
Weet iemand wat ik fout doe ?

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>Testpagina</title>
    <script type="text/javascript" language="javascript">
        function ShowHeight()
        {
            alert(document.body.scrollTop);
        }
    </script>
</head>
<body>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
</body>
</html>

Edit:

De:

JavaScript:

        function ShowHeight()
        {
            alert(window.pageYOffset);
        }

Werkt perfect trouwens

Edit:
Ik heb het probleem al gevonden

HTML:

<!-- Werkt wel: -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<!-- Werkt niet -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Heeft iemand hier misschien nog een andere oplossing voor dan de hele doctype te veranden ?

Edit:

Oplossing:

Body => documentElement

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>Testpagina</title>
    <script type="text/javascript" language="javascript">
        function ShowHeight()
        {
            alert(document.documentElement.scrollTop);
        }
    </script>
</head>
<body>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
    <p onclick="ShowHeight();">Blurp</p>
</body>
</html>

Bedankt voor de hulp

[ Voor 127% gewijzigd door Gurbe de n00b op 06-09-2006 16:20 ]

Portfolio

Reageer