Home Articles FAQs XREF Games Software Instant Books About Feedback Search Site-Map
irt.org logo

Q1383 If a user drags the window or frame scrollbar, is there a way to determine where in the document they've scrolled to?

irt.org | Knowledge Base | JavaScript | Scroll | Q1383 [ previous next ]

Q1383 If a user drags the window or frame scrollbar, is there a way to determine where in the document they've scrolled to?

Try the following (which will work as soon as the user moves their mouse over the document:

<html>

<head>
<script language="JavaScript"><!--
function onScroll() {
    if (document.layers) {
        document.myForm.x.value = window.pageXOffset;
        document.myForm.y.value = window.pageYOffset;
    }
    else if (document.all) {
        document.myForm.x.value = document.body.scrollLeft;
        document.myForm.y.value = document.body.scrollTop;
    }
}
//--></script>
</head>

<body onMousemove="onScroll()">

<p>
Sed ut perspiciatis unde omnis iste natus error sit 
voluptatem accusantium doloremque laudantium, totam 
rem aperiam, eaque ipsa ab illo inventore veritatis 
et quasi architecto beatae vitae dicta sunt explicabo. 
Nemo enim ipsam voluptatem quia voluptas sit aspernatur 
aut odit aut fugit, sed quia consequuntur magni dolores 
eos qui ratione voluptatem sequi nesciunt.  Neque porro 
quisquam est qui do lorem ipsum quia dolor sit amet, 
consectetur, adipisci velit, sed quia nonnumquam eiusmodi 
tempora incidunt ut labore et dolore magnam aliquam 
quaerat voluptatem.  Ut enim ad minima veniam, quia
nostrum exercitationem ullam corporis suscipit laboriosam, 
nisi ut aliquid ex ea commodi consequatur? Quis autem vel 
eum iure reprehenderit qui in ea voluptate velit esse quam 
nihil molestiae consequatur, vel illum qui dolorem eum 
fugiat quo voluptas nulla pariatur?  At vero eos et 
accusamus et iusto odio dignissimos ducimus qui blanditiis 
praesentium voluptatum deleniti atque corrupti quos dolores 
et quas molestias excepturi sint occaccati cupiditate
non provident, similique sunt in culpa qui officia deserunt 
mollitia animi, id est laborum et dolorum fuga.  Et harum 
quidem rerum facilis est et expedita distinctio. Nam libero 
tempore, cum soluta nobis est eligendi optio cumque nihil 
impedit quo minus id quod maxime placeat facere possimus, 
omnis dolor repellendus.  Temporibus autem quibusdam et 
aut officiis debitis aut rerum necessitatibus saepe eveniet 
ut et voluptates repudiandae sint et molestiae non recusandae.
Itaque earum rerum hic tenetur a sapiente delectus
ut aut reiciendis voluptatibus maiores alias consequatur aut 
perferendis doloribus asperiores repellat.
</p>

<form name="myForm">
x: <input type="text" name="x">
y: <input type="text" name="y">
</form>

<script language="JavaScript"><!--
if (document.layers) {
    document.captureEvents(Event.MOUSEMOVE);
    document.onmousemove = onScroll;
}
//--></script>

</body>

</html>

Provide feedback ...
AddThis Social Bookmark Button

Provide feedback ... AddThis Social Bookmark Button


Last Updated: 6th July 2009. Maintained by: Martin Webb and Michel Plungjan
irt.org liability, trademark, document use, privacy statement and software licensing rules apply.
Copyright © 1996-2009 irt.org, All Rights Reserved.