CODEWITHSUNDEEP
javascriptjqueryhtmldom
T.T.T.
T.T.T.

Reputation: 34533

How do I auto-scroll to a specific table row?

I have an html page with a header, a table containing 100 items and a footer.

When there is a search, I highlight the row containing the data.

However, if the highlighted row is row 75, the user has to scroll down to find it.

How can I automatically scroll to that row?

I did see scrollTo() but see it only takes axis points.

Any suggestions?

Thanks.

(Using cgi in C, html, css and javascript/jquery)

Upvotes: 6

Views: 9722

Answers (3)

Soley
Soley

Reputation: 1776

I think you can do something like this:

Use this line where ever you like,

<a id="bookmark"></a>

and when you start your page, call it like this:

http://mypage.com/setting.php#bookmark

That worked for me without showing the anchor.

Check again for using bookmark in html

EDITED: Check: JavaScript - Jump to anchor

Upvotes: 0

sushil bharwani
sushil bharwani

Reputation: 30187

try this: 

<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>

<body onload="ScrollToElement(document.formName.elementName)">

Upvotes: 3

Pointy
Pointy

Reputation: 413717

You should be able to use scrollIntoView(). (It's on the DOM elements directly.)

Be aware that there are some layout situations where scrolling something on the page can cause IE6 and 7 to decide that random other stuff needs to be scrolled too.

Upvotes: 9

Related Questions