Positioning anchor/cell contents within a scrollable div

phub11

Hi all,

This is a pretty simple question, but after some hunting on the web I can't find the answer:

I have a table embedded in a scrollable div, and have each cell anchored so that when a click on a button in another table, the div is scrolled to the corresponding cell of the first table. However, it is positioned such that the cell's contents start at the top-left of the window.

Can I add code which centers the contents of the cell/anchor in the middle of the window of the scrollable div?

Thanks!

johnhjohn

Could you post some of the code you currently have on your page? This will help me determine what changes to make.

Thanks.

phub11

Thanks johnjohn! Below is what I think is all the salient code:

Expand|Select|Wrap|Line Numbers

 
#holderdiv {

width: 170px;

height: 110px;

overflow: scroll;

border: 1px solid black;

}
 
function go(loc) {

i = parseInt(loc.substr(5));

window.location.href = loc;

}
 
      <td><input name="pos" onclick="go('#cell1');"

 type="radio"></td>
 
<div id="holderdiv"> 

<table style="text-align: center; width: 1700px" id="table1"

 border="1" cellpadding="0" cellspacing="0">

  <tbody>

    <tr>

      <td style="width: 150px; height: 100px;"><div style="position: relative;" id="cell1">A1<br>

Empty</td>

      <td style="width: 150px; height: 100px;"><div style="position: relative;" id="cell2">A2<br>

Empty</td>

</div>

phub11

Hi again!

Just seeing if anyone has a suggestion.

Thanks!

rnd me

the cell's offsetTop and offsetLeft properties are what you need.

phub11

Hi johnjohn+rndme,

Thanks for the reply.

I actually ended up using mootools to do it in JS. It adds a nice sliding effect too!

Positioning anchor/cell contents within a scrollable div

re: Positioning anchor/cell contents within a scrollable div

re: Positioning anchor/cell contents within a scrollable div

re: Positioning anchor/cell contents within a scrollable div

re: Positioning anchor/cell contents within a scrollable div

re: Positioning anchor/cell contents within a scrollable div

/bytes/development

/bytes/it

/bytes/about