Scroll To Top

Enter a query to search our site. Note that you can use "*" and "?" as wildcards. Enclosing more than one word in double quotes ("CSS Layout") will search for the exact phrase.

PVII Knowledge Base

1. Select a product ...
2. Select category ...
3. Search the Knowledge Base...

Question #90

How can I have a link that will jump to a specific section of the scrolling layer? Can I use named anchors?

The Answer

Prepared Oct. 2002 by Gerry Jacobsen, PVII

Using named anchors in the scroller will definitely not work cross-browser. The only approach would be to use a script to actually move the scrolling layer to the desired position. Estimate the amount of pixels that the scroller should move in order for the desired section to be visible and then run a function that will move the scroller to that position. Here's a quick layer moving script that will do this for you:

1. Estimate the amount of pixels you need to move, let's say 200px. This means that the layer's top position will be -200 (as measured from its starting point of 0px).

2. Add this function to the script section of your page:

function P7_jumpScroller(lyr,lpos,tpos) { //v1.0 by PVII
  var g,gg,pa='px';
  if(document.layers||window.opera){pa='';}
  if((g=MM_findObj(lyr))!=null){
  gg=(document.layers)?g:g.style;
  gg.left=lpos+pa;gg.top=tpos+pa;}
  }

The function requires three arguments:

  1. the name of the layer to be moved
  2. the left position
  3. the top position

3. Now add the function call to the text link:

<a href="javascript:;" onClick="P7_jumpScroller('p7s1content1',0,-200);return false">MyLink</a>

This will move the scrolling layer up, 200 pixels above the top of the scroller's top edge. We are not changing the left position so we'll keep that at zero (0).

That's it. The scrolling layer will move directly to the new position and the scrolling controls will continue to work as normal.

Back to the questions list