Scrolling Behavior Question.

Thanks for your reply and suggestion. Regarding the below:

Put a span around the images, and set it to direction: ltr and
unicode-bidi: bidi-override. Leave the container as direction: rtl.

Is this what you mean:

#container
{
white-space:nowrap;
direction:rtl;
height:228px;
width:715px;
}

#container span
{
direction: ltr;
unicode-bidi: bidi-override;
}


If this is correct, I tried it and what happens is that the first
image
appears at the far right. Then, as new images are appended, they are
added to the left of the first and overflow to the left.

This is an improvement, but isn't what I am trying to do.

I want the page to load with the first image on the far left (not far
right).
Then, images are clicked and appended **to the right** (not to the
left).

When the right margin is reached, the next click overflows
the first image in the series to the left. The final image
in the series is always in view to the far right.

I appreciate your help. If my CSS isn't what you had in mind, would
you
mind showing me the correction?

Thanks again.

On 2009-09-27, pbd22 <dushkin (AT) gmail (DOT) com> wrote:

Thanks for your reply and suggestion. Regarding the below:

Put a span around the images, and set it to direction: ltr and
unicode-bidi: bidi-override. Leave the container as direction: rtl.

Is this what you mean:

#container
{
white-space:nowrap;
direction:rtl;
height:228px;
width:715px;
}

#container span
{
direction: ltr;
unicode-bidi: bidi-override;
}


If this is correct, I tried it and what happens is that the first
image
appears at the far right. Then, as new images are appended, they are
added to the left of the first and overflow to the left.

You are adding the images to the span, not to the container? You need
something like this:

<div>
<span>
<img>
<img>
<img>
<img>
...
</span>
</div>

This is an improvement, but isn't what I am trying to do.

I want the page to load with the first image on the far left (not far
right).
Then, images are clicked and appended **to the right** (not to the
left).

That should be do-able with text-align: left on the container. I'll try
it just to be sure.

Yes, seems to work. Here is the example:
http://www.tidraso.co.uk/misc/imgContainer/

Is this what you want (only tested in Firefox, should work in any
conforming browser that supports bidi).

When the right margin is reached, the next click overflows
the first image in the series to the left. The final image
in the series is always in view to the far right.

I appreciate your help. If my CSS isn't what you had in mind, would
you
mind showing me the correction?

Thanks again.

AH! Thank you so much!

For some reason it works with <div><span></span></div> but not
<div><div></div></div>.

This one has been escaping me for a few days now. Seriously
appreciated.

Cheers.