Scroll box

Re: Scroll box

waltd — Thu, 30 Sep 2010 15:18:06 -500

I don’t think it’s going to be possible to set up the slider when it is a part of a Carousel like this. The issue is deep in the bowels of Scriptaculous. When the slider setup event for the second and third sliders happens, those sliders are off-screen in CSS limbo. The reason that the thumbs work to move the sliders is because the thumb only has to know the offset of the thumb relative to its track. But in order for clicks on the track to be observed and converted into changes on the slider’s thumb, the click has to be checked against the position of the left side of the track at the moment that the slider is set up, not at the moment that the click is registered. At the moment that the slider is set up (page load) that position is off screen to the right (and hidden by CSS). Clicks on the track area when the Carousel has scrolled the slider into view don’t register, because they are outside of the zone on the screen where the slider used to be.

Walter

On Sep 30, 2010, at 9:59 AM, Thomas Kimmich wrote:

OK Walter,

here we go:

the one under the other (working):

http://www.kimmich-dm.de/kunden/michaelmeier/slider-carousel.html

next stage adding carousel, pane and prev/next:

http://www.kimmich-dm.de/kunden/michaelmeier/slider-carousel2.html

Thanks

Thomas

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options

Re: Scroll box

Thomas Kimmich — Thu, 30 Sep 2010 13:59:17 -500

OK Walter,

here we go:

the one under the other (working):

http://www.kimmich-dm.de/kunden/michaelmeier/slider-carousel.html

next stage adding carousel, pane and prev/next:

http://www.kimmich-dm.de/kunden/michaelmeier/slider-carousel2.html

Thanks

Thomas

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options

Re: Scroll box

waltd — Thu, 30 Sep 2010 13:30:57 -500

I see the problem occurring, but I don’t see any errors in the JavaScript console related to the functions. Everything appears to be named correctly. Could you please do me a favor and remove all other Actions — especially Caxton — from the page, just as an aid to debugging? It is possible that another Action has declared an error handler which is “gobbling up” the errors, making them impossible to see. Once I see an error, I can propose a solution. As things stand, you have followed my directions exactly, so it should work.

As far as removing Carousel from the page, try putting the three panes one above the other in the middle of the page, so you see all of them at once. That should make this relatively simple to diagnose.

Walter

On Sep 30, 2010, at 9:12 AM, Thomas Kimmich wrote:

Hi Walter,

still this one:

http://www.kimmich-dm.de/kunden/michaelmeier/slider-carousel.html

Thomas

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options

Re: Scroll box

Thomas Kimmich — Thu, 30 Sep 2010 13:12:30 -500

Hi Walter,

still this one:

http://www.kimmich-dm.de/kunden/michaelmeier/slider-carousel.html

Thomas

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options

Re: Scroll box

waltd — Thu, 30 Sep 2010 13:08:47 -500

On Sep 30, 2010, at 3:13 AM, Thomas Kimmich wrote:

on klick somewhere on ‘sliderTrack2’,’sliderTrack3’… will not effect, that slider is pushed forward/backward like it is in ‘sliderTrack’ and I can’t find out what function will bring me this (or will bring me not in pane 2+3…).

Do you have an example page showing this problem? I can’t really tell from your description, but it sounds as though you may have wired more than one slider to the same element, or vice-versa.

This is to me a really important aspect regarding “touch”.

And one question to ScriptyLightbox:

What about titles and prev/next image - is it possible to achieve?

There wasn’t any good way to map this behavior onto the Freeway interface when I developed the Action, so I disabled this feature. (It is built in to the core effect library Lightwindow.js. It may return in a future version of the Action.

Walter

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options

Re: Scroll box

Thomas Kimmich — Thu, 30 Sep 2010 07:13:34 -500

Walter - thanks!

One thing left:

on klick somewhere on ‘sliderTrack2’,’sliderTrack3’… will not effect, that slider is pushed forward/backward like it is in ‘sliderTrack’ and I can’t find out what function will bring me this (or will bring me not in pane 2+3…).

This is to me a really important aspect regarding “touch”.

And one question to ScriptyLightbox:

What about titles and prev/next image - is it possible to achieve?

Thomas

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options

Re: Scroll box

waltd — Wed, 29 Sep 2010 16:01:40 -500

I mean that you need to clean up what you have, make sure that the first instance works correctly. Then duplicate the code in the Function Body area, and rename the functions and variables within that second set.

It should look something like this:

var f = function(value){
    var inner = $('innerContentBox');
    var w = inner.getWidth();
    w = (w - inner.up('div').getWidth());
    var leftPos = Math.round(value * w) * -1;
    inner.style.left = leftPos + 'px';
}
var s = new Control.Slider('thumb','sliderTrack', {
    onSlide: f,
    onChange: f
});

var f2 = function(value){
    var inner = $('innerContentBox2');
    var w = inner.getWidth();
    w = (w - inner.up('div').getWidth());
    var leftPos = Math.round(value * w) * -1;
    inner.style.left = leftPos + 'px';
}
var s2 = new Control.Slider('thumb2','sliderTrack2', {
    onSlide: f2,
    onChange: f2
});

To change the ID of an HTML box in Freeway, just use the Title field of the Inspector. The three elements you need to rename are the inner box of the slider area, the thumb, and the track of the slider. Those are called innerContentBox2, thumb2, and sliderTrack2 in the example above.

Just for a little extra geekery, the variables inner, w, and leftPos do not need to be changed, because they are encapsulated inside a function, declared with the var keyword, and not declared outside of that function body.

Walter

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options

Re: Scroll box

Thomas Kimmich — Wed, 29 Sep 2010 14:52:42 -500

Walter,

to be honest:

except of the fact, that the function s has to be renamed into s2, nearly nothing I really understood.

OK - to remove the second codeset s from the functions body of protaculous so there is only the basic - no deal.

But where to insert the s2 code-instance instead? It is a single page and the “s2” is a carousel pane sitting on the same page.

Change the ids of HTML-Element will be extended -> class = id; name = s2? Or where do I change the HTML ids properly?

Well - I’m willing to learn this and store it in brain - but actually I need some further advices.

Thanks in advance

Thomas

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options

Re: Scroll box

waltd — Wed, 29 Sep 2010 13:05:49 -500

Please read through the second-to-last paragraph in my last long answer to you. Your primary issue is variable and function naming. Each sliding area needs its own set of variables, and these need to be policed inside and out of the function bodies. There’s a whole list of them in that previous message. I would try removing all but one set of code from the page, then copy that, go through all the variables, and tack a 2 to the end of each, and then change the ids of your HTML elements to match.

Walter

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options

Re: Scroll box

Thomas Kimmich — Wed, 29 Sep 2010 12:44:05 -500

Hi Walter,

no I haven’t ‘cause I removed the +/- buttons as a “not necessary” one.

So yet only slider-problem left.

Thanks

Thomas

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options

Scroll box

duotone — Wed, 13 Feb 2008 13:32:22 -500

How do I create a scrolling box like the one here:

http://www.apple.com/mac/

Thanks!

Tony

freewaytalk mailing list email@hidden Update your subscriptions at: http://freewaytalk.net/person/options