Software, your way.
burger menu icon
WillMaster

WillMaster > LibraryWeb Page and Site Features

FREE! Coding tips, tricks, and treasures.

Possibilities weekly ezine

Get the weekly email website developers read:

 

Your email address

name@example.com
YES! Send Possibilities every week!

Automatic Scroll To Exact Pixel Position
When Page Loads

Generally, when a page is loaded, the upper-left part of the page is visible in the browser window or frame. This article describes how to display a different part of the page by automatically scrolling an exact amount.

The automatic scroll can be done whether the page is by itself in a browser window, within a frame, or within an iframe tag.

The page can be scrolled down from the top and/or in from the left.

Example of use: To display an article by itself in the browser window without header and navigation distractions, the web page can be scrolled down to the headline and right to the edge of the article column.

 
How To Implement Automatic Scrolling

Put this JavaScript somewhere in the web page that will be scrolled.

<script type="text/javascript"><!--
// November 3, 2009, https://www.willmaster.com/
// Copyright 2009 Bontrager Connection, LLC
function AutoScrollOnload() {

// Specify how many pixels from the left 
//    and how many down from the top to 
//    automatically scroll the page.

var InFromLeft = 172;
var DownFromTop = 364;

// No other customization required.

window.scrollTo(InFromLeft,DownFromTop);
}
function AddOnloadEvent(f) {
if(typeof window.onload != 'function') { window.onload = f; }
else {
   var cache = window.onload;
   window.onload = function() {
      if(cache) { cache(); }
      f();
      };
   }
}
AddOnloadEvent(AutoScrollOnload);
//--></script>

Two edits are required, the amount of scroll down from the top and in from the left. The place for the edits is marked.

If you have a tool to measure number of pixels in your browser window, it can be used to determine the amount of scroll. (The Firefox Web Developer add-on has such a tool.)

Otherwise, make a guess. Then load the page, adjust the numbers, and reload until the scroll is correct.

Test your implementation on different browsers, especially if the page is in an iframe. Different browsers my have different line breaks or other rendering that changes the amount to scroll.

When implemented, the web page should automatically scroll by the number of pixels specified when it completes loading - unless the page area is not large enough. No scroll will go beyond the bottom or right edge of the page area.

Will Bontrager

Was this article helpful to you?
(anonymous form)

Support This Website

Some of our support is from people like you who see the value of all that's offered for FREE at this website.

"Yes, let me contribute."

Amount (USD):

Tap to Choose
Contribution
Method

All information in WillMaster Library articles is presented AS-IS.

We only suggest and recommend what we believe is of value. As remuneration for the time and research involved to provide quality links, we generally use affiliate links when we can. Whenever we link to something not our own, you should assume they are affiliate links or that we benefit in some way.

How Can We Help You? balloons
How Can We Help You?
bullet Custom Programming
bullet Ready-Made Software
bullet Technical Support
bullet Possibilities Newsletter
bullet Website "How-To" Info
bullet Useful Information List

© 1998-2001 William and Mari Bontrager
© 2001-2011 Bontrager Connection, LLC
© 2011-2024 Will Bontrager Software LLC