Think this one goes out to Walter, but any other problem solvers welcome!
Trying to figure out how to have (blue) corresponding selection buttons appear on my carousel panes, as illustrated on the Softpress homepage - so the user can select each image in the slide.
You can add as many different copies of the Carousel Tab Action to
your page as you like, so you could have a set of tabs (and I’m
referring to tabs as what they do, not necessarily what they look
like) within each pane, as well as a set (or two) outside the Carousel
area. Each tab chooses which pane it will signal to, so more than one
can signal the same pane to come to the fore.
If you’ve done the extra-credit homework, you’ll know how to make the
‘active’ tab have a different color or style automatically. Again,
this magic happens across all tabs on the page.
Walter
On Jul 7, 2011, at 7:39 AM, Nat wrote:
Think this one goes out to Walter, but any other problem solvers
welcome!
Trying to figure out how to have (blue) corresponding selection
buttons appear on my carousel panes, as illustrated on the Softpress
homepage - so the user can select each image in the slide.
Sorry to say though, I’m just not getting it.
I understand you can add as many different copies of the Carousel Tab Action to your page as you like…but then what? Won’t they be visible?
Sorry it’s tedious, but instructional steps for dummies is what I need…particularly with your reference to extra-credit homework!
If you add Carousel Tab elements to your individual panes as nested or
child objects, then they will hide and show with the rest of the pane.
Try these steps and see how it goes (use a blank page for speed and
disposability).
Draw an HTML box where you want your Carousel to appear. While that
box is selected, draw a small graphic box over the top of it so it
becomes a child (edges of the HTML box light up while you draw). Make
sure that you leave room to the right or left for four total images
(these will become your in-pane tabs).
Draw another graphic box directly on the page.
Click once on the first graphic box you drew (the child element)
and give it a color, and apply the Carousel Tabs Action to it. Don’t
bother with the settings, which won’t work yet. While it’s still
selected, use the Item / Duplicate menu command to step-and-repeat it
three times for a total of 4 tabs. Use horizontal offset to space them
perfectly while you duplicate!
Do the same with the “outer” tab, so you have four of those as
well, all with the Tab action applied.
Duplicate the outer HTML box containing the tabs. This will become
your second pane.
Apply Carousel directly to the first HTML box. Apply Carousel Pane
to the duplicate you made of it. Give each of these boxes some bright
color so you can see the changes happening.
Now duplicate your Pane element two times so you have the full set
of panes. Go back through the various tabs and panes and be sure they
are pointing to the correct pane, using the Target picker and similar.
Now, if you publish this, you can see that regardless which set of
tabs you use, only the outer (not nested) and one inner (nested) tab
set is visible at any one time. If you want to get rid of the outer
tab set, you can – the whole thing will work.
Walter
On Jul 7, 2011, at 8:52 AM, Nat wrote:
Thanks so much for the quick response Walter…
Sorry to say though, I’m just not getting it.
I understand you can add as many different copies of the Carousel
Tab Action to your page as you like…but then what? Won’t they be
visible?
Sorry it’s tedious, but instructional steps for dummies is what I
need…particularly with your reference to extra-credit homework!
I’ve followed your instructions, but the result isn’t the one either of us would want I’m afraid.
I’m obviously going wrong with the ‘outer’ tabs part.
Here’s how it looks:
I hope it helps and doesn’t confuse things too much. The only tricky thing (in retrospect) was getting the tabs to work although if you look at the document it should be apparent how they’ve been set up.
Regards,
Tim.
On 7 Jul 2011, at 16:51, Nat wrote:
Hi again Walter,
I’ve followed your instructions, but the result isn’t the one either of us would want I’m afraid.
I’m obviously going wrong with the ‘outer’ tabs part.
Here’s how it looks:
Thanks - thing is, I’d previously downloaded this to follow the set-up as you suggest, but confusingly the tabs don’t appear when I go to preview?
Do you mean in preview or in Freeway’s design view? The potentially confusing part here is that I used background images for the tab states. Each tab has a class of tab added to it and a style that sets the default background image to ‘btn.png’. The Carousel code changes this class to active when the tab is, well, active and a second CSS style sets the background image to ‘btn-selected.png’.
Also, in page mode, there is just one ‘nav-group’ containing 4 graphic boxes…and no ‘blue’ colour tabs / corresponding graphic at all.
If you want the tab states just to change color then you should be able to this without the need for the background images and just using CSS.
If I can come full circle, your last comment is really what I’m sure must be able to be done / what I’m trying to do…“If you want the tab states just to change color then you should be able to this without the need for the background images and just using CSS.”
Walter laid down instructions which I presume were along this line, but it didn’t work out for me…I must be missing something, doing something wrong somewhere.
If possible, lets touch base again in the morning. I have to resolve this one way or another, as my client loves the carousel, so I’ll need those visible tab changes!
The tabs don’t use images in this version and just change colour which (I think) is the effect you are after.
The thing to remember is that the Carousel Action will apply a style of ‘active’ to the tab that is currently is use. Knowing this we can style the tabs as we want but need an active style that can be created in the Edit Styles dialog box. Since you can’t have a CSS style change the foreground image or colour of an item we need to make each of the tabs clear images (set their colours to ‘None’) and define a style that sets their default background colours to whatever colour you like (I chose a colour I called ‘Tan’).
Look in the Edit Styles dialog and you’ll see a style called ‘.tab’ which sets the background colour of the default tabs. Now all we need to do is to give each tab a class of ‘tab’ so that Freeway knows to apply this style to the tab items. Select each tab in turn and select Item > Extended and then the ‘div’ tab in the dialog. Click New and add name: class and value: tab
Finally we need to define the ‘active’ style that Carousel will apply to the active tab. Again in the Edit Styles dialog create a style called ‘.active’ and define a background colour.
Now when you preview the page the ‘tab’ style should set the default colours of all of the tabs and the ‘active’ style should define the colour of the one in use.
If this is anything like the effect you are after you can simply copy this carousel to your document, change the images and the colours of the tab states and you should be done. If you were after something different let me know and I’ll take another look.
Regards,
Tim.
On 7 Jul 2011, at 22:39, Nat wrote:
If I can come full circle, your last comment is really what I’m sure must be able to be done / what I’m trying to do…“If you want the tab states just to change color then you should be able to this without the need for the background images and just using CSS.”
Firstly, thanks once again for your time and patience on this.
I’ve followed your excellent instructions to a tee, and double-checked I’ve matched every setting with the carousel test version you sent me…but incredibly still it just isn’t working. I’m really at a loss as to explain why not.
I called Softpress HQ and understand you’re working from home today, so am loathe to disturb you. But I wondered if at all possible you could spare me 5 mins off forum to nail this.
I’m happy to leave my number / skype (as we could screen share?) with Softpress HQ.
If not, please advise as to the best way to proceed.
Hi Nat,
I’ve sent you a direct email with my contact details. Feel free to get in touch and I’ll see if I can get this sorted out for you.
Regards,
Tim.
On 8 Jul 2011, at 11:58, Nat wrote:
I called Softpress HQ and understand you’re working from home today, so am loathe to disturb you. But I wondered if at all possible you could spare me 5 mins off forum to nail this.
I’m happy to leave my number / skype (as we could screen share?) with Softpress HQ.