Topic awaiting preservation: Anyone familiar with Doc Ozones's Snippets? (Page 1 of 1)

Me again,

Following some earlier advice in a previous post I have reverse-engineered/deconstructed the Doc's sliding looping lanscape thingy to make my thumbnail scroller (mucho respecto to the Doc!).

examples: http://www.cryokinesis.co.uk/test/OzoneScroll/OZONE.htm - the basic scroller http://www.cryokinesis.co.uk/test/OzoneScroll/Copy%20of%20OZONE.htm - the sort of layout i'm trying to create.

I have got it working reasonably ok, but have a few things left to do, all of which seem beyond my limited brainal capacity, so help would be appreciated:

1. firstly how to i stop it auto scrolling onload?
2. how do I confine the 'activation' area to the area of the scroller itself?
3. how do make the scroller fit in a container div that has no specified pixel value, has a width relative to the size of the page, and is set off centre? (somehow I need to get all measurements from the container div after page load - including setting the centre point for scrollin activation to the centre point of the div
4. how do I get the scrolling movement to be zero when the mouse pointer is at the centre of the div and to then increase (accelerate) as the mouse pointer moves further towards the left or right edge of the div?

Ok I realise this is a lot of questions, and complex ones at that - I also know that there are previous thread and faq that discuss acceleration, but I didn't really understand the methods specified without any working examples to play with. I am asking for a lot of help, I have taking on board criticisms of my posts from previous replies so I'm not expecting anyone to do all the work for me, but merely just point a few helpful fingers and maybe post a few useful urls etc.

Thanks

A1. See A2

A2. Well, if you know the x,y position of the mouse and the top, left, bottom and right of the DIV, just bypass the scroll function whilst the mouse x,y is inside the DIV area.

how do make the scroller fit in a container div that has no specified pixel value, has a width relative to the size of the page, and is set off centre? (somehow I need to get all measurements from the container div after page load - including setting the centre point for scrollin activation to the centre point of the div


A3. You'll want to look into the offsetLeft offsetHeight etc properties as those are the only ones that will give you values in pixels that you haven't set using CSS. For example, If you set a DIV width to 100%, it's offsetWidth property will return it's width in pixels.

A4. Well, if you know how far (in pixels) away from the center the mouse position is along the x axis, then you can use that value as a factor as to how far you re-position the scrollers contents each time through the loop. If the mouse is at 0 center, then it don't move. If it's +100 pixels (right) then you'll want to re-position the content 100 pixels to the left each time around. If it's at -200 pixels (left) then you position the content -200 pixels each time around. If this ends up scrolling things too fast simply divide the offset value to slow it slow things down.

Thanks bud, given me some things to work with.

about your acceleration scroll suggestion, wont that be jerky? isn't there a smoother way to sort this?

Anybody else have suggestions like this then please post them here.

Jerky?... Um... No. Why would it be?

quote:

---

If it's +100 pixels (right) then you'll want to re-position the content 100 pixels to the left each time around

---

Aren't you saying that it should change position by 100px, surely that would be a jump and not a nice transition, I guess I still don't understand sliding scrollers and the setTimeOut thing.

I'm still looking for a range of hints, tips and suggestions from people, not that your tips aren't good, but I want as many as possible in order to have the widest array of potential solutions possible to fit my specific need, if that makes sense to anyone.

Well, obviously 100 pixels would be too fast, but what other value would you use appart from the distance the mouse is away from the centre of the DIV?

None.

So if 100 pixels is too fast then how could you make it smaller?

Maybe you could divide that number by 10, which would mean each 10 pixels the mouse is away from the center it will scroll 1 pixel in that direction. Or you could divide it by 5, or 20, or some other factor, maybe some value dirived from the DIV's width or the total width of the scrollable content or some such. Regardless of what you do, you'll be needing to use that value in some form or another as that's the only value that'll give you the right +/- values for the scrolling direction.

You could also use that value to alter the setTimeOut lapse but doing that doesn't really scale quite as well across different browsers.