How to save horizontal scroll bar position on page postback

[RobertK]

I have a table that displays one row of images (thumbnails). When a
user clicks on an image it opens up a bigger image below it. The row
has about 20 cells. I have a <divtag which allows the user to scroll
left and right to see all the images. The problem is that when the
user scrolls to the middle and clicks on the image. The click causes a
post back and the page loads again and the scroll bar goes to the
left.

I need to know how to save the horizontal scroll bar position of the
table and re position the scroll bar at the same position when the
page loads.

I am doing this in c# and using image buttons in each cell of the
row. The images are kept in the database.

[scripts.contact]

On Jun 4, 3:07 pm, RobertK <[e-mail]:

I need to know how to save the horizontal scroll bar position of the
table and re position the scroll bar at the same position when the
page loads.

use scrollLeft property :
http://msdn2.microsoft.com/en-us/library/ms534617.aspx

[RobertK]

On Jun 4, 9:50 pm, "scripts.contact" <[e-mail]>
wrote:

On Jun 4, 3:07 pm, RobertK <[e-mail]:

I need to know how to save the horizontal scroll bar position of the
table and re position the scroll bar at the same position when the
page loads.

use scrollLeft property :http://msdn2.microsoft.com/en-us/library/ms534617.aspx

This works ok with the page scrolling. I need some code to force a
scrollbar of a div tag to move to a position.

I tried the following which doenst seem to work.
document.getElementById('Div1').style.scrollleft=s omevalue;

how can I set a scrollbar position of a panel or div on load??

[Jeff North]

On Mon, 04 Jun 2007 21:07:10 -0000, in comp.lang.javascript RobertK
<ro******@gmail.com>
<11**********************@o5g2000hsb.googlegroups. comwrote:

>| I have a table that displays one row of images (thumbnails). When a
| user clicks on an image it opens up a bigger image below it. The row
| has about 20 cells. I have a <divtag which allows the user to scroll
| left and right to see all the images. The problem is that when the
| user scrolls to the middle and clicks on the image. The click causes a
| post back and the page loads again and the scroll bar goes to the
| left.

Fix the postback action:
<img src="..." onclick="ShowImage(); return false;" />

>| I need to know how to save the horizontal scroll bar position of the
| table and re position the scroll bar at the same position when the
| page loads.

Alternatively use Lightbox, Greybox, Thinbox etc

>| I am doing this in c# and using image buttons in each cell of the
| row. The images are kept in the database.

---------------------------------------------------------------
jn******@yourpantsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------

[Randy Webb]

Jeff North said the following on 6/9/2007 7:00 AM:

On Mon, 04 Jun 2007 21:07:10 -0000, in comp.lang.javascript RobertK
<ro******@gmail.com>
<11**********************@o5g2000hsb.googlegroups. comwrote:

>| I have a table that displays one row of images (thumbnails). When a
| user clicks on an image it opens up a bigger image below it. The row
| has about 20 cells. I have a <divtag which allows the user to scroll
| left and right to see all the images. The problem is that when the
| user scrolls to the middle and clicks on the image. The click causes a
| post back and the page loads again and the scroll bar goes to the
| left.

Fix the postback action:
<img src="..." onclick="ShowImage(); return false;" />

Clicking an image has no default behavior so returning false from the
onclick of an img doesn't make a lot of sense.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

[dd]

On Jun 4, 11:07 pm, RobertK <[e-mail]:

The problem is that when the user scrolls
to the middle and clicks on the image. The
click causes a post back and the page loads
again and the scroll bar goes to the left.

You could use a session cookie to maintain the position of the
scrollbar. What I think you really want though, is to change what
happens when the thumbnails are clicked on. I think you want to stop
it doing a navigation and instead just load the image into
the .innerHTML property of the DIV that shows the larger image.
Returning false from the onclick handler should prevent a navigation.
This will be quicker because it won't be loading the whole page all
the time, and as a side-effect, the scrollbar position will of course
remain the same.