Multiple Carousel

Hi all,

I want to have a carousel with 3 tabs.

Once each tab is selected the corresponding carousel comes into view in that same pane. EG: tab1, tab2 & tab3. (gallery, videos & blog in my instance)

Once tab 1, 2 or 3 is selected and the pane comes into view I then want to be able to view each tabs carousel panes via a carousel btn respectively! Trying to get my head around this…???

In short I want 1 carousel with 3 tabs, each tab containing 3 panes: Possible??

Tab1 (pane 1,2,3)
Tab2 (pane 1,2,3)
Tab3 (pane 1,2,3)

Example link:

http://www.edwardlawlor.co.uk/2012/fw/css-menu/index.html

Suffering from designers block atm. Any help is greately appreciated

Worm


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

You cannot nest a carousel inside another carousel. It’s a limitation of the script. You could use a different technique (Show/Hide Layer or similar) to load the three carousels, but not carousel itself.

Walter

On Mar 19, 2012, at 9:04 AM, Mr worm wrote:

Hi all,

I want to have a carousel with 3 tabs.

Once each tab is selected the corresponding carousel comes into view in that same pane. EG: tab1, tab2 & tab3. (gallery, videos & blog in my instance)

Once tab 1, 2 or 3 is selected and the pane comes into view I then want to be able to view each tabs carousel panes via a carousel btn respectively! Trying to get my head around this…???

In short I want 1 carousel with 3 tabs, each tab containing 3 panes: Possible??

Tab1 (pane 1,2,3)
Tab2 (pane 1,2,3)
Tab3 (pane 1,2,3)

Example link:

http://www.edwardlawlor.co.uk/2012/fw/css-menu/index.html

Suffering from designers block atm. Any help is greately appreciated

Worm


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

Thanks Walt.

I thought this may be the case :frowning:

Not sure whats the best route to take to achieve what I’m after…

I want 3 carousels to ‘appear’ nested within one div. controlled via 3 tab carousles. On each is selected and in view, you can then use the next/prev buttons to navigate the panes inside each of the 3 carousels.

My carousels panes currently contain 5 images, each image being its own item & link. (see my link in above post for example)

How would you tackle this Walt?

Having not used the (Show/Hide Layer) for some time i’m struggling to get this to work, do the panes need to be 1 entire image?

Worm


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

Is it critical that the animation between the three carousels have the carousel “feel”? It would be pretty simple to create a target show/hide construction that would allow you to switch between three carousels, but that transition would be a sharp cut (or a fade) but would not be animated right to left.

Walter

On Mar 20, 2012, at 10:35 AM, Mr worm wrote:

I want 3 carousels to ‘appear’ nested within one div. controlled via 3 tab carousles. On each is selected and in view, you can then use the next/prev buttons to navigate the panes inside each of the 3 carousels.


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

Yes and no! It would be ideal… but a target show/hide construction would help ATM.

I know its complex, but possibly a future feature of the carousel action… nested carousels!

Can you post a very simple .zip example walt please.

While I think of a solution, thanks Walt.

Worm


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

http://scripty.walterdavisstudio.com/multi-carousel.freeway.zip

There’s two pages, the first shows how I started (with all three visible) and the second shows where I stacked them and added the Target Show/Hide stuff. The only thing missing here is the first pane showing at page load. I can’t recall if there is an Action to do that, I don’t have one here. The issue is that if you want all of the panes to cooperate in the same group, so that only one is ever visible at a time and they are sticky (only change visibility if another option is moused over) then they all have to be initially hidden.

Walter

On Mar 20, 2012, at 11:16 AM, Mr worm wrote:

Yes and no! It would be ideal… but a target show/hide construction would help ATM.

I know its complex, but possibly a future feature of the carousel action… nested carousels!

Can you post a very simple .zip example walt please.

While I think of a solution, thanks Walt.

Worm


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

Amazing Walt!

Thanks a million

Worm


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

Just a quick one Walt, in yoiur multi carousel example if I wish to make the first carousel initially visible, I can do this by setting item (target/show layer - one) to initially visible. But if you select anotehr carousel tab then tab 1 again it dissapears!!

Is it be to set the main web content behind this to a bg image that will be the default image you always see?

Worm


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

On Mar 21, 2012, at 6:07 AM, Mr worm wrote:

Just a quick one Walt, in yoiur multi carousel example if I wish to make the first carousel initially visible, I can do this by setting item (target/show layer - one) to initially visible. But if you select anotehr carousel tab then tab 1 again it dissapears!!

Right. That’s what I mentioned in my message. I don’t know if there’s any way to have a cooperating group of target layers where the first one is initially visible on page load. If anyone else knows of a way to do this, please pipe up! As you note, having it initially visible just means that when its trigger is clicked, it hides instead of appears.

Is it be to set the main web content behind this to a bg image that will be the default image you always see?

Yes, that’s an often-used hack around this. It can be a background, or a foreground element as long as the other layers cover it.

Walter


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

Walt if you dont know then I doubt anyone else will, buy I’m ever the optimist!!!

I can get by with a background element for now!!!

Thanks

Worm


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

Walt, I found a way around this:

http://www.edwardlawlor.co.uk/2012/fw/carousel/bg-image.html

Thanks again!!

Worm


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

Hi Walt,

Just finalizing my site & the ‘multiple crousels’ thy work great, however when I select one on the tabs gallery, video or blog the page jumps up to the top?

http://www.edwardlawlor.co.uk/2012/fw/carousel/index.html

I think they are intfearing with an anchor or something else on the page?

I did also want to apply the smooth scoll page action at the bottom but that also seems to cause friction?!!

Could you take a look when you get a chance please

Thanks Walt for all your help

Worm


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

Any time you see Carousel effects “snap” into place, that means that you have a JavaScript error and the effect isn’t actually working correctly. The default behavior when there’s no JavaScript to be had is for the panes to snap into view when their tabs are clicked (there’s no similar affordance for buttons – and no way to add one without JS).

Try looking at the page again, and make sure that you have all the latest versions of all the Actions you’ve applied to the page. Look on ActionsForge for the actual numbers. Mis-match between Protaculous and SmoothScroll could easily account for this. They all have to be tracking at the very latest version in order to guarantee that they won’t conflict with one another or the built-in Freeway effects.

Walter

On Mar 23, 2012, at 1:27 PM, Mr worm wrote:

Hi Walt,

Just finalizing my site & the ‘multiple crousels’ thy work great, however when I select one on the tabs gallery, video or blog the page jumps up to the top?

http://www.edwardlawlor.co.uk/2012/fw/carousel/index.html

I think they are intfearing with an anchor or something else on the page?

I did also want to apply the smooth scoll page action at the bottom but that also seems to cause friction?!!

Could you take a look when you get a chance please

Thanks Walt for all your help

Worm


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

Hi Walt, I have scanned the apge and all the actions are the latest versions!! Still no joy???

It only jumps when you click one of the ‘Rollover’ action 2.11 tabs??

Could it to be with ANY of the pre-sets in the action like find target, preload, restore?!!

Or is it simply bacause I have 2 carousel on the page?

Should I try removing all instances of the crousel action publish, save & then re-apply them?!!!

I need this site up and running today so need a solution a.sap or I may be forced to remove an element from the site, which I wish to avoid!!!

Worm


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

Currently running Target show/hide layer 2.0.14

Worm


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

http://www.edwardlawlor.co.uk/2012/fw/carousel/index.html

Does anyone have any suggestions please, try using either carousel. Once clicked the page scrolls???!!!

I need to stop this…???

Worm


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

It looks to me as though you have a version mis-match in your Actions. One of the Actions is properly linking to Prototype 1.7 from Google’s CDN. The other(s) is/are linking the Prototype 1.6 branch directly from the Resources folder. That is the one that has to stop. My money is on SmoothScroll, because I did an update a while back to that in order to get it to ignore any anchor links that were made by Carousel Tab, and I don’t see that shim here.

Try duplicating this Freeway document, and delete all the pages except this one, then go through all of the elements on the page and remove the Actions from them. You don’t have to delete all the panes etc., but you have to remove all of the Actions both from the page and from the elements on the page. Then publish once. Now go back through and re-apply the Actions. See if the problem is gone.

If that works, then you’ve isolated the problem to Freeway’s document cache. This means you now need to go through all of the pages in your original site and repeat this process. Make sure you go through all pages that have any Scripty Actions on them – remove them all from all pages – then publish once, then build the effects back up again.

If the problem isn’t gone, then triple-check that you have a) the very latest version of Freeway, b) the very latest version of SmoothScroll (0.5), c) the very latest version of Carousel (1.3). If you find that you are out of date on any of these, first try updating the Action and publishing again (maybe with the Control key held down so Publish becomes Publish Everything). If that doesn’t do it, then you may need to go through the whole remove-all-actions-publish-add-all-actions dance. Again, that’s a good reason to make the cut-down one page site and try it there.

Walter

On Mar 26, 2012, at 11:19 AM, Mr worm wrote:

http://www.edwardlawlor.co.uk/2012/fw/carousel/index.html

Does anyone have any suggestions please, try using either carousel. Once clicked the page scrolls???!!!

I need to stop this…???

Worm


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

Hi Walt, did everything you said… its better BUT the 2nd carousel tabs … “gallery, video & blog” still make the page snap into place once clicked?!!

Any ideas

Worm


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

Yay – the double JavaScript library problem is gone!

Try manually applying a link to each of your rollover elements (the tabs you are using to change target/show/hide layers). In the Hyperlink dialog, switch to the External tab, and enter only this in the field:

javascript:

The issue is that by itself, Rollover creates an empty anchor link to do its job, and that link is indistinguishable from any other anchor link on the page. Since the SmoothScroll Action looks for anchors and adds its behavior to any that it finds on the page, you get the result you see here.

Walter

On Mar 27, 2012, at 7:07 AM, Mr worm wrote:

Hi Walt, did everything you said… its better BUT the 2nd carousel tabs … “gallery, video & blog” still make the page snap into place once clicked?!!

Any ideas

Worm


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

Houston, we have lift off!!!

That did the trick Walt, thought the rollover may have had something to do with it.

http://www.cmlmarketing.com/2012/rdc/index.html

Looks & works great now… many thanks

Worm


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