[ANN] Carousel turns One-Dot-Oh

Get it while it’s hot. Much simpler application this time around. The entire mechanism has been re-worked, so you no longer have to group ANYTHING.

1. Draw a CSS-positioned layer on your page where you want the carousel effect to appear. Style it up to become the first pane of your carousel.
2. Duplicate this layer to make the next pane, and so forth until all of the panes are finished. (You may place these panes anywhere on or off the page, they will be removed from view when you publish.)
3. Apply the Carousel Action to the first pane.
4. Apply the Carousel Pane Action to all of the remaining panes.
5. (Optional) add tabs or buttons to control the effect with the Carousel Tab and Carousel Button Actions.
6. Publish.

You can have multiple Carousels on a page, as before, but instead of grouping the controls and the panes together to tell the controls which panes to affect, you simply choose your carousel using the Target picker in the Actions palette. This should make editing your page a lot easier.

Walter

quote

Hi Walter, thanks very much… a lot easier!! I have the tabs working perfectly but the buttons are not working for me?

quote

HI, the buttons are not working for me either.

I also have a request - the previous version of this Action which I have been using works really well as an inline item - perfect if you are relying on the Carousel not to be overwritten by content above it on the page. Is there a reason this was stopped? And can it be restored?

quote

Actually, just been tinkering with the Action and amended the action-appliesto part of the carousel Action, and it seems to be fine.

quote

…. and then again, perhaps not. It would be very handy to have this functionality returned to the Actions.

quote

Hi Paul, while we are waiting for Walter to have a look at this… Paul, sorry a little off subject. It’s in regards to your wonderful Iframe action, if you add ALLOWTRANSPARENCY=”true” to the bottom of your action then transparency works in IE 6, 7 & 8 . Simply it’s telling all browsers your Iframe wants transparency.

Something like this ….

iframe src=”&URL;” name=”&Name;” width=”&_width;” height=”&_height;” frameborder=”&FrameBorder;” marginwidth=”&MarginWidth;” marginheight=”&MarginHeight”; ALLOWTRANSPARENCY=”true”; scrolling=”&Scrolling;”

All the best,

Pete

quote

Walter - definitely easier - I’ve just done a test on a quick rebuild of an existing carousel. Couple of points:

1. Like others, I cannot get the next/previous buttons to work.

2. The first tab of a series causes a problem, in that I can’t target the layer annointed with the overall Carousel action. I can point the other tabs at layers annointed as Carousel Panes, no problem there. I have however a workaround, as detailed below.

Delete the Carousel action from the layer you applied it to. Apply the Pane action to that layer and select this pane from the first tab - it will now see it. Now revert the layer back to the Carousel action. Cures it for me.

quote

on 20/04/2009 06:01, Walter Lee Davis at email@hidden wrote:

You can have multiple Carousels on a page, as before, but instead of grouping the controls and the panes together to tell the controls which panes to affect, you simply choose your carousel using the Target picker in the Actions palette. This should make editing your page a lot easier.

That’s a much neater solution, thanks for your work on this.

I’ll add my name to the buttons not working, but the tabs are fine.

Best wishes Peter

================================ Peter Tucker, Oxford UK email@hidden

quote

on 20/04/2009 06:01, Walter Lee Davis at email@hidden wrote:

1. (Optional) add tabs or buttons to control the effect with the Carousel Tab and Carousel Button Actions.

I’ve created a set of panes and have a tab for each, they work fine except the first one. I cannot code the tab to go back to the main [original] pane.

Best wishes Peter

================================ Peter Tucker, Oxford UK email@hidden

quote

I’ve created a set of panes and have a tab for each, they work fine except the first one. I cannot code the tab to go back to the main [original] pane.

Best wishes Peter

================================ Peter Tucker, Oxford UK email@hidden

Take a look at the workaround I posted 2 or 3 posts above Peter, assuming it’s the same problem. You have to switch the Carousel action applied to the first carousel, for a Carousel Pane action, point the offending tab to it and then revert back to the Carousel action.

Cheers, Ian

quote

I have a site chuck-full of the old Carousel action. Before I change them all over a question.

Is it possible to link to a specific pane on a page from another page with the new action?

Thanks.

quote

on 20/04/2009 14:54, Ian Halstead at email@hidden wrote:

I¹ve created a set of panes and have a tab for each, they work fine except the first one. I cannot code the tab to go back to the main [original] pane.

Best wishes Peter

================================ Peter Tucker, Oxford UK email@hidden

Take a look at the workaround I posted 2 or 3 posts above Peter, assuming it’s the same problem. You have to switch the Carousel action applied to the first carousel, for a Carousel Pane action, point the offending tab to it and then revert back to the Carousel action.

Hi Ian, oh yes, I now have both the Carousel and Carousel Pane actions applied to the first “base” pane, now it works.

Best wishes Peter

================================ Peter Tucker, Oxford UK email@hidden

quote

Hi Ian, oh yes, I now have both the Carousel and Carousel Pane actions applied to the first “base” pane, now it works.

Best wishes Peter

================================ Peter Tucker, Oxford UK email@hidden

Ahhhh, nice one Peter. I didn’t think to apply both actions to the base carousel. I must have lost something in interpreting the original instructions somewhere, but what you’ve just done solves it nicely.

Cheers,

Ian

quote

Sorry, that was a regression on my part. I’ll have it fixed in a little while.

Walter

On Apr 20, 2009, at 10:36 AM, Ian Halstead wrote:

Hi Ian, oh yes, I now have both the Carousel and Carousel Pane actions applied to the first “base” pane, now it works.

Best wishes Peter

================================ Peter Tucker, Oxford UK email@hidden

Ahhhh, nice one Peter. I didn’t think to apply both actions to the base carousel. I must have lost something in interpreting the original instructions somewhere, but what you’ve just done solves it nicely.

Cheers,

Ian

quote

All fixed. Carousel Tab and Carousel Button have each been revved, both omissions have been fixed.

Walter

quote

walt,

As an aside - could this action be made to work with a css menu driving the panes? The original action (and I’ll be honest I haven’t grabbed onedotoh) wouldn’t allow the tabs to be applied to text they had to be images - is this still the case ?

Regards,

mmull

quote

On 20 Apr 2009, 9:06 pm, mmull wrote:

walt,

As an aside - could this action be made to work with a css menu driving the panes? The original action (and I’ll be honest I haven’t grabbed onedotoh) wouldn’t allow the tabs to be applied to text they had to be images - is this still the case ?

That is still the case, but I could make a cousin of the tabs action called Carousel Text, and that might work for you. The thing to realize, though, is that you can’t actually apply an action to text in Freeway. The next best thing is to create an Action that emits text, and creates a link. If I do that correctly, you would be able to double-click into the space where you want the text link to appear, select Insert / Action Item from the main menu, and create the text and the link in one go in the Actions palette.

Walter

quote

Thanks Walter, Works a treat now. Pete

quote

On 20 Apr 2009, 2:19 pm, george wrote:

I have a site chuck-full of the old Carousel action. Before I change them all over a question.

Is it possible to link to a specific pane on a page from another page with the new action?

No, it still behaves the same in that respect. Have you tried the question mark trick? Make an anchor, but instead of the hash, ire a question mark. http://server.com/somepage.html?pane3

Walter

quote

Many thanks for the fix Walter. All genuinely appreciated. I might have to put you in my will now, though I’ve already bequeathed the yacht*.

*It should enhance the recipient’s bath-time.

Cheers,

Ian

quote

on 20/04/2009 23:32, Walter Lee Davis at email@hidden wrote:

On 20 Apr 2009, 9:06 pm, mmull wrote:

walt,

As an aside - could this action be made to work with a css menu driving the panes? The original action (and I’ll be honest I haven’t grabbed onedotoh) wouldn’t allow the tabs to be applied to text they had to be images - is this still the case ?

That is still the case, but I could make a cousin of the tabs action called Carousel Text, and that might work for you. The thing to realize, though, is that you can’t actually apply an action to text in Freeway. The next best thing is to create an Action that emits text, and creates a link. If I do that correctly, you would be able to double-click into the space where you want the text link to appear, select Insert / Action Item from the main menu, and create the text and the link in one go in the Actions palette.

That does sound useful ;~}}

Best wishes Peter

================================ Peter Tucker, Oxford UK email@hidden

quote

on 21/04/2009 01:23, Pete at email@hidden wrote:

Thanks Walter, Works a treat now.

Full marks for trimming down the often excessive previous posts, but when the thread spawns like a hydra it means deleting everything, and we don’t know what “works a treat now” ?

Best wishes Peter

================================ Peter Tucker, Oxford UK email@hidden

quote

hello just saw this thread

so I have to redo my all my Carousels ugh!I wish I knew that before upgrading. I have so many carousels..

ok one thing do I still draw HTML and then the graphic box inside it>>

quote

ok now I get it! it works fine

but now what about the anchors?? which are on another page

quote

Hello,

I’m kind of new to freeway. I just upgraded to this action from the older one. When I am trying to redo one of the carousels which were all grouped together and choose the panes and add the new actions, it doesn’t work. I also tried publishing all and it still does not work. Is there something else I should have downloaded or updated besides the action? or… Does anyone have any pointers as to why this is happening?

quote

Hi Pedro

In many/most cases it is invaluable to provide a link to an example page where you have a problem. This allows the code savvy guys out there a chance to look at the nuts and bolts of your page, pull it apart and find the problem.

Before doing this set the HTML code to More Readable (File>Document Setup>Output - 2nd dropdown) and when posting a link here use the full web address starting http://www. which will ensure it is a clickable link.

Have you followed the updated directions at the beginning of the thread and made sure that you do have the latest version. The bottom of the inspector pane should show you the version number.

Also make sure that the Carousel action is applied to the first Pane and that the Carousel Pane action is applied to the rest. If you have other actions on your panes or the contents of your panes then remove them while testing.

David

quote

Sometime around 20/6/09 (at 18:07 -0400) Pedro said:

I’m kind of new to freeway. I just upgraded to this action from the older one. When I am trying to redo one of the carousels which were all grouped together

Hi Pedro,

Ungroup the panes and treat each one as a separate entity. If your panes each contain multiple items those can be grouped together, but you don’t have to group the panes themselves together. In fact, it doesn’t work like that any more.

Set up each pane as a selft-contained item, position the first one where you want your Carousel to be and apply the Carousel action, then apply the Carousel Pane action to each subsequent pane.

(Make sure you don’t have the Carousel action (or Carousel Pane, etc.) applied to any items within your panes. I did this and it made it stop working. Removing the action from any items within a pane group fixed the problem. If you group items together to make a composite pane, always apply the action to the group item, not items within the group.)

Those other panes can be positioned wherever you like, on or off the page. They’re removed from the layout and stashed ready for display in the Carousel when the page is published.

The regular stacking order - which is in front, which behind - determines the playing order in the Carousel. To change the running order just bring forward/send backward or bring to front/send to back.

Magic stuff! :-)

k

quote

It is working perfectly now! Thanks for the quick replies. I checked everything and made sure I had the latest update.

On a side note: Does anyone know if the custom scrollbar and the carousel have some sort of conflict? I have a carousel in a page and when I add the scrollbar it shows an error saying: “This page contains packed and regular versions of the prototype or scriptaculous libraries. Publishing can not continue.” But as soon as I remove the carousel or the scrollbar it works perfectly. I will give up on the scrollbar because of lack of time but I am still curious as to why it did not work.

Thanks again!

quote

Walter,

How do your get the right arrow in your example (link below) so close to the carousel? When I try to put a button that close it always kicks it way off to the right when I view it in a browser. No trouble with the left side. I know it’s my lack of skill with FW, but this kind of stuff drives me nuts. I’ll be done with our website in 2020 at this rate. I tried doing an inline box model to control it but the action said it wouldn’t work because it had to be a layer. I do have CSS on, but I guess once I put it inside the box model it didn’t like that.

http://scripty.walterdavisstudio.com/carousel/#instructions

Other than that little problem due to ignorance, this action is killer. I don’t know how you do it. Thank you!

quote

Sometime around 22/6/09 (at 05:28 -0400) wurliuchi said:

I tried doing an inline box model to control it but the action said it wouldn’t work because it had to be a layer.

The box model approach is something of a workaround. Until something more integrated comes along, my advice is if you have problems with it just leave it alone. Having said that, there are some real box model whizzes here, so they may be able to offer actual help instead of plain avice. :-)

But I believe the Carousel action requires items to be simple individual layers. Remember, all but the first actual Carousel-defined object will be removed from the layout and stored invisibly elsewhere in the code, ready to be shown in place on demand. Perhaps you can do what you want by putting just the main Carousel item into your box model construction and leaving the Carousel Pane items as ordinary free-standing layered items?

k

quote

How are you adding the custom scrollbar? Are you following instructions I posted elsewhere to use the Protaculous Action? If so, change the Library picker in Protaculous from scriptaculous to scriptaculous-packed and upload again.

Walter

On Jun 21, 2009, at 8:51 PM, Pedro wrote:

“This page contains packed and regular versions of the prototype or scriptaculous libraries. Publishing can not continue.” But as soon as I remove the carousel or the scrollbar it works perfectly.

quote

On 22 Jun 2009, 9:53 am, thatkeith wrote:

Sometime around 22/6/09 (at 05:28 -0400) wurliuchi said:

I tried doing an inline box model to control it but the action said it wouldn’t work because it had to be a layer.

The box model approach is something of a workaround. Until something more integrated comes along, my advice is if you have problems with it just leave it alone. Having said that, there are some real box model whizzes here, so they may be able to offer actual help instead of plain avice. :-)

But I believe the Carousel action requires items to be simple individual layers. Remember, all but the first actual Carousel-defined object will be removed from the layout and stored invisibly elsewhere in the code, ready to be shown in place on demand. Perhaps you can do what you want by putting just the main Carousel item into your box model construction and leaving the Carousel Pane items as ordinary free-standing layered items?

k

Yes, I’m only putting the main C and the buttons in the box model. I’ll try again. I was kind of punchy when I tried it last night.

Thanks.

quote

Walter is this correct?

As I build mainly box model sites with inline content now, this will certainly break any carousels using the earlier carousel action.

Could you clarify? Thanks in advance

I believe the Carousel action requires items to be simple individual layers.

quote

On 22 Jun 2009, 4:19 pm, WebWorker wrote:

Walter is this correct?

As I build mainly box model sites with inline content now, this will certainly break any carousels using the earlier carousel action.

Could you clarify? Thanks in advance

I believe the Carousel action requires items to be simple individual layers.

I don’t really want to use a box model. Like I said, the action didn’t work when I tried to put it in one. I understand that it needs to be an individual layer. I’m just trying to get the right button (arrow) close to the carousel and I’m not able to do that. The html box (an individual layer) holding the graphic on the right keeps getting pushed away from the carousel box (an individual layer) when viewed in a browser and it doesn’t look good. I don’t have any trouble with the left side doing this. So my question is, how do you get the right button so close to the carousel as Walter did in his example page?

http://scripty.walterdavisstudio.com/carousel/#instructions

Thank you.

quote

Here’s an example of what I’m talking about.

http://www.northcoastsoundsystem.com/

quote

On 22 Jun 2009, at 17:43, wurliuchi wrote:

I don’t really want to use a box model. Like I said, the action didn’t work when I tried to put it in one.

Is it possible that the answer might be to put the separate items inside a box that was, in turn, part of a box model? If you don’t have anything where it breaks it if it grows downwards (and it sounds as though you don’t) then the separate parts could live in a box model box perhaps?

best wishes,

Paul Bradforth

http://www.paulbradforth.com

quote

You know, I bet that’s it. When I looked at the source code on Walter’s page (not that I really understand it), I noticed that the right arrow div is floated left, that’s what first got me thinking to use a box model. So, if I make a small box model from the right edge of the page over to the carousel, just for the arrow, that should force it to stay where it should.

I’m going to try that.

Thanks!

quote

That demo page is bog-standard Freeway layer code. No box model nothing! I drew it where I wanted it, the float is just what Freeway does when you draw a GIF box somewhere — it makes a DIV for the position and floats the image inside it.

The Action converts your drawn pane layers into a box-model construction inside of a DIV created wherever you put the master Carousel. But you don’t need to do any of that yourself, just draw boxes where you want them to lie, and be done.

Walter

On Jun 22, 2009, at 1:50 PM, wurliuchi wrote:

When I looked at the source code on Walter’s page (not that I really understand it), I noticed that the right arrow div is floated left, that’s what first got me thinking to use a box model.

quote

Thank you. No matter what I tried I could not get that right button to be close to the carousel. So I just deleted everything and started over drawing things in where I wanted them to be (just like I did the first time). This time it worked without a problem. I don’t know why this keeps happening to me. I have to do everything twice. I think FW has it our for me.

Thanks again. You’re an Action Hero.

On 22 Jun 2009, 5:58 pm, waltd wrote:

That demo page is bog-standard Freeway layer code. No box model nothing! I drew it where I wanted it, the float is just what Freeway does when you draw a GIF box somewhere — it makes a DIV for the position and floats the image inside it.

The Action converts your drawn pane layers into a box-model construction inside of a DIV created wherever you put the master Carousel. But you don’t need to do any of that yourself, just draw boxes where you want them to lie, and be done.

Walter

On Jun 22, 2009, at 1:50 PM, wurliuchi wrote:

When I looked at the source code on Walter’s page (not that I really understand it), I noticed that the right arrow div is floated left, that’s what first got me thinking to use a box model.

quote

Hi Walter,

Can I ask if you can do what is done on this website http://www.gogogunner.com/ with carousel? If you go under portfolio it shows a slider that slides by having the mouse over the pictures instead of a button. Can you tell me if I can do this under carousel? Thank you again for all your hard work.

quote

Another question, if you don’t mind, Walter. Is it possible to use the Carousel Action without having all the Panes preload?

quote

There isn’t anything in the Carousel Action itself to do this sort of thing. The example you showed here is done with jQuery and a few plugins for that system.

Walter

On Oct 19, 2009, at 10:39 AM, Peter Parker wrote:

Hi Walter,

Can I ask if you can do what is done on this website http://www.gogogunner.com/ with carousel? If you go under portfolio it shows a slider that slides by having the mouse over the pictures instead of a button. Can you tell me if I can do this under carousel? Thank you again for all your hard work.

quote

No, that’s how it’s able to work smoothly. You’re just revealing content that’s always there. There are other carousel kits out there that load the panes through Ajax, but this one doesn’t do that.

Walter

On Oct 19, 2009, at 5:37 PM, Bucky Edgett wrote:

Another question, if you don’t mind, Walter. Is it possible to use the Carousel Action without having all the Panes preload?

quote

Hi Walter,

I am trying to link up image titles to the panes. is that possible to do with your actions (or any other actions) ? I have two buttons I use (previous, next) for the carousel, but the buttons can only be linked to one item group. how can I make the text move along with the images?

Cheers Mischa

quote

Put your text and the picture into a div (layer) and use the whole div as your carousel pane.

David

quote

Walter,

Thanks for your reply. Can you tell me why the carousel horizontal with buttons does not work on Windows 7?

Here is my website http://varickdesign.com. It is under portfolio where I have a slider that goes from left to right with buttons. It works in Firefox and Safari but on Windows 7 it will not advance properly to to the 3 pane.

Thank you.

quote

Sorry meant to say explore 7 instead of…

quote

On 20 Oct 2009, 11:24 pm, DeltaDave wrote:

Put your text and the picture into a div (layer) and use the whole div as your carousel pane.

David

Thank you David, yes that works fine.

Mischa

quote

Walter,

Due to time constraint I had to upload the site with a change using the scriptylightbox. Still interested in how to get the slider working using the buttons on IE 7. I will try to set up another site and post it up there. Thanks again for your help.

quote

Hi all,

Can a timer be applied to the carousel, so that each view is shown for a given time, and then moves on automatically to the next page, rather than needing to be clicked?

I am looking to use two carousels with 4 pages in each, and then as the first one has shown all 4 pages, the next one fades in to show its 4 images, and repeat. Hoping to avoid the fast rewind effect.

Thanks

quote

In the Carousel action window you can set an auto glide interval that will change the frame to the next without a click after a set time period.

Is that what you want?

David

quote

Hi WaltD,

Did you ever get round to adding the Carousel Text function to the script ?

Just wondered as I am now enjoying the fruits of many hours extra learning and hand coding my sites to get things just as I want. If this was available though I would be able to return some of my quick turnaround sites to Freeway again…

On another note, does anyone know why the CSS menus script generates so much code ? It can be down much more efficiently with handcoding…

All the best,

mmull

quote

Yes, David. That is precisely what I was after.

Thank you.

quote

Hi.

I’m looking for a way to combine the Carousel action with some kind of “modal box” to build a picture gallery with small thumbnails (which should rotate using Carousel) and larger images that should appear in-line (on the page) when clicking at the thumbnails.

Originally I tried Weaver’s old “Spawn New Moodalbox” action, but due to incompatibilities of the used libraries this doesn’t work.

Is there an alternative action available ? At actionsforge.com I had no luck…

Just to demonstrate what I mean, visit http://www.elektrikforen.de/hausger-te/8746-neuer-backofen-streikt-sicherung-fi-l-sen-aus-2.html . In the middle of the page there are three small images that become larger when clicked. Imagine there would also be a Carousel-like action, then we come close to that what I intend to achieve.

Thanks for any hints or comments :-)

Tobias.

quote

And may I add another followup-question to waltd:

Do you plan to implement a button that allows going back to the first pane (or even to jump directly to a specific pane) ?

quote

Me again, sorry to bother you so often… I just found that the Carousel buttons don’t work well with rollovers.

Applying the button action to the grouped rollover item generates an error: “thisitem has no properties”.

Applying the button action to a child element of the group makes the rollover effect to go away.

Since problems with rollovers aren’t discussed here, I guess that I made something wrong. Perhaps you can give me a hint (or two ;-)

Awaiting your answer. Thank you again :-)

Tobias.

quote

Hello Walter and everyone I just made a new carousel and I never came across a problem like this. I made all html and graphic layers , imported files , ticked Carousel and the rest as C Panes.. great & buttons and named everything from item to a real name It works fine. There are 2 images that are not vertical but horizontal, they do not come up full frame and are cut off. I even created the file the same size, so that was not the problem.. I wonder if any of you can take a look to see what I am not doing right. I continue to trouble shoot but to no avail

Thanks so much here is link http://exitcuckoo.com/exitcuckoophotos.html

quote

On 14 Nov 2009, 12:10 pm, tobiaseichner wrote:

And may I add another followup-question to waltd:

Do you plan to implement a button that allows going back to the first pane (or even to jump directly to a specific pane) ?

The Carousel Tab Action is for that. Apply the Action to a graphic, select which pane you want to target, and you’re all set. A click on that graphic will take you to the pane it’s set to, no matter where else in the carousel you are currently.

Walter

quote

On 14 Nov 2009, 1:43 pm, Carla wrote:

Hello Walter and everyone I just made a new carousel and I never came across a problem like this. I made all html and graphic layers , imported files , ticked Carousel and the rest as C Panes.. great & buttons and named everything from item to a real name It works fine. There are 2 images that are not vertical but horizontal, they do not come up full frame and are cut off.

All of your panes have to be the exact same dimensions, so if you have a mix of vertical and horizontal elements, try making your panes square, and then center the graphics within that square area.

Walter

quote

I even created the file the same size

If you are going to do this with portrait and landscape pics in the same carousel then your graphics in your panes are going to have to be the same size.

Are 3,4 and 7 the landscape ones?

Make the graphic boxes wide enough to accommodate your widest picture and tall enough to suit your tallest - adjust each one to suit the graphic you import at the size you want. This may mean centering horizontally/vertically.

At the moment I can see that your carousel graphics are only 330 wide and 452 tall

David

quote

Thanks for response.. although you guys always taught me to fit box to graphic on each pane sooo.. where do I go from there? The HTML boxes are all same size/ thanks for the help David

quote

The HTML boxes are all same size

And inside these HTML boxes do you have graphic boxes - graphic boxes which should be large enough to fit your widest and tallest pics (as should the HTML boxes)

D

quote

Make sure that the graphics are children of the HTML boxes, other than that I can’t imagine what could be the problem. The pane that you have applied the Carousel action to will define the dimensions for all of the panes in the group. Anything you apply Carousel Pane to will just be sucked into the slider div created by Carousel, and its dimensions will be assumed from the dimension of the first item.

Walter

On Nov 14, 2009, at 10:07 AM, Carla wrote:

Thanks for response.. although you guys always taught me to fit box to graphic on each pane sooo.. where do I go from there? The HTML boxes are all same size/ thanks for the help David

quote

Here is a carousel that has different sized pics in it

http://tardiffphotography.com/masks.html

D

quote

I wil go work on the HTML size that could be the problem

quote

thanks that was the problem, but I fell like a dodo

I have made these simple carousels for a while and forgot the HTML had to be the same size Thanks

quote

@waltd: Thanks for the hint with the tab action, I’ll give it a try.

Do you have an idea why my rollover button refuses to work with the Carousel button action ?

quote

Rollover is broken in the Carousel Button, but it works in the Carousel Tab. I need to fix something (actually Paul sent me a fixed version a while back and I need to upload that).

Walter

On Nov 14, 2009, at 4:23 PM, tobiaseichner wrote:

@waltd: Thanks for the hint with the tab action, I’ll give it a try.

Do you have an idea why my rollover button refuses to work with the Carousel button action ?

quote

Rollover is broken in the Carousel Button, but it works in the Carousel Tab.

Unfortunately it has to be a button for this task… anyway, time isn’t a real problem (if we talk about few weeks), so I can certainly wait.

Should it take longer, just let me know and I’ll change the current layout not using rollovers, which is also an option.

Anyway, thank you for your efforts. The Carousel is really an outstanding action :-)

quote

Hi guys

I have one question as i also like the Carousel….action

when images transition there is a little wobbly thing going between….. I have made sure the files are small so its not a loading issue.. any ideas?

Thanks

quote

I’m facing a strange problem with the Carousel on a complex page using Weaver’s sFx Accordion action and rollovers (and some other actions, but these are image manipulation ones):

Creating a new page from master works well. Carousel and other actions.

When I then apply modifications to that page (also on items not associated with Carousel), the animation of the Carousel action stops to work and the first graphical tab of a set of tabs is getting lost (broken image on browser, image is fine on FW).

I removed sFx action from the page (since beside Carousel it is the most complex one on that page), but the result is the same. Carousel’s animation is gone and the first Carousel Tab is lost.

When I delete the first tab, the second one disappears when previewing the page in webbrowsers. Really strange.

Safari’s JavaScript console gives me something like this:

�PNG SyntaxError: Parse error

quote

As an addition to my bug report:

When I force the entire site being re-created, the problem persists. BUT when I delete the entire site folder and then re-generate the website, Carousel is working again and the “disappeared” image is back again.

However as soon as I do another modification to that page (e.g. adding a new item or modifying a HTML text), the problem returns and it is necessary to remove all contents from the site folder to make it work again.

Tobias.

quote

And me again… it seems that it isn’t possible to place Carousel buttons or tabs within a Carousel or Carousel pane, is ?

My intention was to create some kind of menu at the first Carousel page to let user jump to given chapters.

But when I do so, the Carousel doesn’t work (no error message, however).

Tobias.

quote

Strange… buttons are working within Carousel items, tabs don’t.

Tobias.

quote

You might want to have these buttons float above the Carousel itself in a separate layer. Try drawing them off screen, then drag them over the top of your Carousel area.

Walter

On Nov 29, 2009, at 10:00 AM, tobiaseichner wrote:

Strange… buttons are working within Carousel items, tabs don’t.

Tobias.

quote

@waltd: I tried so, but unfortunately this destroys my layout on Windows OS (small differences in font size hides the text behind the images there).

Anyway, is this something we can consider as a bug and it becomes solved within the next weeks (as the other reported one not allowing to use rollovers with Carousel buttons) ? I’m not in a hurry and could wait if it is something that might get solved.

(I know you are doing all this for free in your spare time, so it’s not criticism, but more a wish :-)

Again, thanks for your help.

Tobias.

quote

Is it intended that a JavaScript error generated on one page (Carousel tab) also affects the same action on other pages ?

Because I noticed that when having a faulty Carousel action on one page, also other pages are not working.

Tobias.

quote

If you get a JavaScript error in an Action, that error will remain lodged in Freeway until you clear it (or it gets fixed with a new version of the Action). Click on an object that has the problematic Action applied, and look in the Actions palette. You should see a Clear Error button there. Press it. Then publish again. When you see the error, take a screen shot of it, because there’s no other practical way to get the error out to the developer.

Walter

On Dec 2, 2009, at 3:59 PM, tobiaseichner wrote:

Is it intended that a JavaScript error generated on one page (Carousel tab) also affects the same action on other pages ?

Because I noticed that when having a faulty Carousel action on one page, also other pages are not working.

quote

Here it is: http://www.starenterprise.com/jserror.tiff

The error is related to the Carousel tab action being added to a rollover-styled image.

Hope it’s of help to you.

Tobias.

quote

Check to be sure you have the very latest version of the Protaculous Action installed. This doesn’t look like the current code. If you don’t, be sure that you look through the new directions, as the application method has changed.

Walter

quote

Interesting… I updated your action using either this link or the repository at actionsforge.com, not sure. Isn’t there the latest Prototype/Scriptaculous included, is ?

Anyway, installed Carousel is version 1.1, Carousel button 0.8, Carousel pane 0.2 and Carousel tab is 0.6.1.

The protoype file is named prototype1602packer.js and scriptaculous file is named scriptaculous181packer.js.

Strangely opening the files in a JS IDE I get just one long line of text… well, shouldn’t matter but it looks like there is an EOF issue.

Furthermore there is a glider.js that opens fine in my IDE (Komodo) and is labelled version 0.0.4.

Well, how I built the page I’m using the Carousel:

I created a set of HTML items. At the first item I applied the “Carousel” action and at the other ones the “Carousel pane”. There are no groups of objects, if you mean this.

Then there is a set of Carousel buttons and tabs placed outside the HTML objects (remember about my issue I reported with tabs placed insight a Carousel pane).

The only “special thing” there is that I applied the rollover actions to all of these buttons and tabs and built the buttons using image items and an action named “füllmeister” in my German version to get a background showing a colour gradient.

Of course, the button image items are grouped together for making the rollover thing working.

Do you have any insights for me ?

Tobias.

quote

Try adding a link to your rollover buttons — it can be anything, even just a # in the External field.

I don’t believe this should be necessary, but you might try it and see if it makes any difference. I have tested here and Carousel Tabs definitely “plays nice” with rollover effects.

Walter

On Dec 3, 2009, at 2:46 PM, tobiaseichner wrote: >

Do you have any insights for me ?

Tobias.

quote

Absolutely strange (my new favorite word ;-)

I created a new project and copied the page in question to that new project to exclude any side effects of actions placed on other pages there.

First try: Error message appears “as usual”.

I removed all buttons, page is generated nicely. Then started to create new buttons with rollovers and coloured backgrounds, even my special font I used. Then applied both (not at the same time, of course ;-) actions, tabs and buttons to the images.

Second try: Page is generated as intended and works (well, button without rollover effect, but that’s acceptable so far and was expected).

Then I copied my existing button set to the page and removed all tabs and button actions there. The page generated well.

Now I applied a tab action to one single button (at the “grouped” item, not to a member of it).

Third try: Error message appears again.

Fourth try with button action failed as well.

Now I changed the image type from PNG (millions of colours) to GIF (adaptive 256 colours). Fifth try failed.

However I noticed there that one graphic has 0 bytes. And applying the rollover action to the container makes only the container item to show up at action’s settings.

So there really seems to be something wrong with my existing buttons (they were copied and pasted several times, maybe this broke something).

I’ll check this out by creating them from scratch, which is a bit time consuming but confessed, it’s my last idea.

Thanks so far for having a closer look at this issue. Any insights or tips are welcome :-)

As soon as I gave it a try, I let you know here for sure :-)

Tobias.

quote

Make sure that you try this set of steps:

1. Draw a new HTML box on a new page of a new document. Fill it with a color, and apply the Carousel Action to it.
2. Duplicate that box (Command-D) and drag it off somewhere else. Remove the Carousel Action and add the Carousel Pane Action. Change the background color to something different.
3. Draw a new graphics box on the page, fill it with a color. Duplicate it in place (0,0 offsets) and fill it with a different color.
4. Drag a selection rectangle around the two graphic boxes so you are sure they are both selected, then Group them.
5. Apply the Rollover Action to the group. Set your Rollover effect so that the colors change when you mouse over the graphic.
6. Apply the Carousel Tab Action to the group. Set it to target the second pane in your low-fi carousel.

Preview, and it should Just Work^™.

Walter

On Dec 3, 2009, at 3:34 PM, tobiaseichner wrote:

Thanks so far for having a closer look at this issue. Any insights or tips are welcome :-)

quote

I did exactly as you describe, but there must be an issue with my old button items.

Now I removed all existing buttons and created them from scratch, and… what should I say, anything works now as expected :-)

However this entire thing will be a profound mystery for me. Not sure what went wrong, especially because I created the buttons exactly the same way as I did first time.

Anyway, it works and nothing else matters :-)

So thank you again for taking a closer look to my issues.

Tobias.

quote

Hi Walter, Im looking at trying to add 2 carousals both activated by one set of buttons - also i need one of the carousals to slide the opposite way to the other?! Is this possible? Know a work around? Cheers

Jus

quote

The Carousel effect will move in either direction, but if you are running it in automatic animation mode, it always starts at the right and animates left until it reaches the end, then rewinds and repeats. There is no way to change that — it’s hard-wired into the underlying JavaScript effect that I used to make the Action.

You can have one Carousel with multiple sets of controls, but there is no way to have one set of controls move multiple Carousels. Again, this is baked in and intentional.

The only way to work around the second problem would be to hand-code a replacement for the function generated by the Action. You would need to do something like this:

Original: http://gist.github.com/270331

New: http://gist.github.com/270333

Now that I think about it — if you’re going this far you could always “tell” the second Carousel that left meant right, and to start at the last item in the options.

Counter-move: http://gist.github.com/270337

The differences are subtle, but what you are doing is creating a single observer for the buttons assigned to one object that can move both objects at the same time. The Action can’t build that for you. Note that if you do this, you will have to make these code changes over again (in a text editor) each time you change the design.

Walter

On Jan 6, 2010, at 10:11 AM, Justin Easthall wrote:

Hi Walter, Im looking at trying to add 2 carousals both activated by one set of buttons - also i need one of the carousals to slide the opposite way to the other?! Is this possible? Know a work around?

quote

@walter

Is there a way to target the carousel and it’s panes from a text link?

Rob

quote

Sure. You only need to create an anchor link to the pane, using the ID of that pane as the anchor URI. So if the pane you want to move to using your text link is called item4, you would highlight your link text, open the Hyperlink dialog, move to the External side of things, and enter #item4 as the entire link.

That’s all it takes.

Walter

On Jan 7, 2010, at 11:22 AM, RobP wrote:

@walter

Is there a way to target the carousel and it’s panes from a text link?

Rob

quote

Walter

Thanks for this quicky. However I’m using the “markup element” for the link.

Currently it shows: Xentis

What would be the correct link to put in manually to target “item4”?

quote

Xentis</ a>

Walter

Thanks for this quicky. However I’m using the “markup element” for the link.

Currently it shows: Xentis

What would be the correct link to put in manually to target “item4”?

quote

Walter,

something went wrong With the link. It’s à bit more then Xentis. How can I put the link in a reply?

quote

How can I put the link in a reply?

4 Tildes in a row ~~~~

New line and paste your code then new line and 4 more Tildes ~~~~

David

quote

Thanks Walter appreciated

The differences are subtle, but what you are doing is creating a single observer for the buttons assigned to one object that can move both objects at the same time. The Action can’t build that for you. Note that if you do this, you will have to make these code changes over again (in a text editor) each time you change the design.

Walter

quote

Sorry about the link, I was replying from mail and couldn’t check directly what Markdown would think of it.

<a href="#item4" title="Xentis carbon producten"><span>Xentis</span></a>

That’s what it’s supposed to look like.

Walter

quote

I’m really loving this carousel action, but I would sure like the rollover to work with the carousel buttons. Any progress in this department? Thanx!

quote

I wonder if it’s possible to implement some kind of conditions ? For example it would be helpful to disable the “Next page” button when viewing the last Carousel pane.

quote

That’s a cool idea. I’ll have to put that on the list.

Walter

On Feb 24, 2010, at 3:31 PM, tobiaseichner wrote:

I wonder if it’s possible to implement some kind of conditions ? For example it would be helpful to disable the “Next page” button when viewing the last Carousel pane.

quote

Yeah, this would be nice. I currently work on a “multi-page” order form using the Carousel action. While it looks great already, here is a small wishlist of what perhaps could be done:

• Disabling next page button (as previously mentioned, just to be complete).
• Change button caption on a per-page base.
• Enabling/disabling other elements on a page (e.g. have the form submit button visible only at the last pane).

Well, not sure what can be realized finally (perhaps there are some technical limitations I haven’t thought about while my imagination ran wild ;-) .

Oh, and I found a small bug (not sure if it is one, let’s call it strange behaviour instead of): When directly linking to a Carousel pane using an acnhor link (e.g. “#mypane5”), then the Carousel switches to that pane but without any animation.

quote

• Change button caption on a per-page base.

Could you include copies of the button in your Carousel panes? Then you could swap things around automatically as part of the Carousel’s standard existing behaviour.

I did something a little like this to make the Preferences controls for the Hyperwords extension for Google Chrome; there’s a CSS Menus navigation thing that sits on top of the Carousel, and each Carousel pane has it’s own arrangement of ‘tabs’ that show up behind the CSS Menus text. The result is as if the CSS Menus option for hilighting the current page is able to work for same-page, different pane Carousel structures too. And setting the slide time to zero makes it behave more like an app.

To see this… Run Google Chrome and go to http://www.hyperwords.net/ Click the install button, then go to any web page, select some text and point at the small ‘droplet’ icon that appears. Click the ‘hw’ logo at the bottom of the menu… the Hyperwords Preferences layout you’ll get is a Freeway production, sliced and diced into the extension by one of the programmers. (Who is also called Tobias, coincidentally.)

k

quote

This is normal. If you use a question mark instead of a hash mark (and then the ID of the pane), you will get the load-then-scroll behavior.

Walter

On Feb 24, 2010, at 4:48 PM, tobiaseichner wrote:

Oh, and I found a small bug (not sure if it is one, let’s call it strange behaviour instead of): When directly linking to a Carousel pane using an acnhor link (e.g. “#mypane5”), then the Carousel switches to that pane but without any animation.

quote

This is normal. If you use a question mark instead of a hash mark (and then the ID of the pane), you will get the load-then-scroll behavior.

“?mypane5” works, but with one negative side-effect: I have another Carousel on that page (panes all named differently) which also moves to a pane.

Using “#mypane5”, the other Carousel isn’t affected (of course also the Carousel buttons are working well as intended - so this just happens when using a question mark styled link).

Do you have a guess what the reason might be ?

Tobias.

quote

@thatkeith: Thanks. I’ll check this out definitively.

quote

That doesn’t make any sense at all. Only the carousel that has the named object in it should be affected. Can you post a link so I can watch the goings-on with Firebug?

Walter

On Feb 24, 2010, at 6:40 PM, tobiaseichner wrote:

This is normal. If you use a question mark instead of a hash mark (and then the ID of the pane), you will get the load-then-scroll behavior.

“?mypane5” works, but with one negative side-effect: I have another Carousel on that page (panes all named differently) which also moves to a pane.

Using “#mypane5”, the other Carousel isn’t affected (of course also the Carousel buttons are working well as intended - so this just happens when using a question mark styled link).

Do you have a guess what the reason might be ?

Tobias.

quote

I’ll prepare a page and contact you by e-mail later today.

Tobias.

quote