Guy
0
I have an image nested inside an anchor nested inside a div:
<div style="max-width: 600px; overflow-x: scroll;">
<a href="PoolPanoramaBig.jpg" target="_blank">
<img src="PoolPanoramaBig.jpg" style=""/>
</a>
</div>
When the page loads I want the horizontal scroll bar to be scrolled to the right (defaulted to the right) so that if the image is wider than 600px the right edge of the image will be visible and the left edge will be scrolled out-of-sight.
I have been unable to work out how to do this with either CSS or with JavaScript (using jQuery). Any ideas much appreciated.
3 answers
danwellman
3775
1
point
point
Have you tried setting the direction in the CSS?
img { direction:rtl; }
That may only work on text though...
- huh, never heard of this in CSS before... nice.
Divya Manian
815
1
point
point
If damwellman's suggestion does not work, you could try putting an empty span with an id, <span id="lastarea"></span> and then using this in the url #lastarea
Tony Crockford
5195
0
points
points
For future clarity the solution is this:
<div style="max-width: 600px; overflow-x: scroll; direction: rtl;">
<a href="PoolPanoramaBig.jpg" target="_blank">
<img src="PoolPanoramaBig.jpg" style=""/>
</a>
</div>
- wanted a reference when I come back to see how to do it! Dan was right, but the direction needs to go on the container.
