CODEWITHSUNDEEP
javascripthtmlcss
christina
christina

Reputation: 21

How to have a page load to the middle of the page (instead of top)?

I'd like for the page to open at a certain div halfway down the page, not at the top...

I have something like:

<div id="d1">
<div id="d2">
<div id="d3">
<div id="d4">
<div id="d5">
<div id="d6">

How can I get the page to open at #d4, instead of the top? (Besides adding #d4 to the end to the URL...)

I imagine there must be some easy way to do this, but I can't figure out how to go at searching for a solution! HTML, javascript? Any help is greatly appreciated.

Upvotes: 2

Views: 6056

Answers (4)

Orny
Orny

Reputation: 665

<script>
function ScrollToElement(theElement){

  var selectedPosX = 0;
  var selectedPosY = 0;

  while(theElement != null){
    selectedPosX += theElement.offsetLeft;
    selectedPosY += theElement.offsetTop;
    theElement = theElement.offsetParent;
  }

 window.scrollTo(selectedPosX,selectedPosY);

}
</script>

http://radio.javaranch.com/pascarello/2005/01/09/1105293729000.html

Upvotes: 2

SLaks
SLaks

Reputation: 887449

You can use Javascript:

location.replace('#d4');

Upvotes: 0

Patrick
Patrick

Reputation: 1167

EDIT: OOPS! didn't read the Except.... disregard!

Note to self, read the entire question before responding!

End EDIT

You could always use an HTML anchor tag

<a name="d1" />
<div id="d1"> 
<a name="d2" />
<div id="d2">
<a name="d3" /> 
<div id="d3"> 
<a name="d4" />
<div id="d4"> 
<a name="d5" />
<div id="d5"> 
<a name="d6" />
<div id="d6">

When you navigate to the page, you would include the anchor name in the url: pagename.htm#d4

Make sure to close your div tags.

Good luck,

Patrick

Upvotes: 0

Ehsan
Ehsan

Reputation: 1961

Find div position using this and then use the following javascript command:

window.scroll(0, DIV_POS); // horizontal and vertical scroll targets

Upvotes: 0

Related Questions