[Pro] Clickable Maps & Transition FX

Freeway
1

I need to put a map on a page in my site that will ultimately take users to unique information depending on where they click on the map. I want that information to appear over the map on the same page, if possible.

I created the following page with Transition FX, which works wonderfully in FireFox and Safari, but it is broken in all versions of IE (6,7,8):

http://www.kiramek.com/japanese/products/sciborg/dealers.html

If you open that page in Safari, you will see that this is a map of Japan with various sections of the country named. Most of those names are dimmed (and not clickable) because those are sections of the country I don’t have info to link to yet. So as you can see, I’ve got only 3 clickable sections on that map. When you click one of those 3 sections, you will then see a colored rectangle appear and clicking again will take it away. I made one of them a rollover + Transition FX, while the other two simply have the Transition FX action applied to them.

Again, this works fine in Safari and FF but not in IE. In IE those colored rectangles are never hidden and they appear immediately when you load the page. Even so, I absolutely have to get my map page to work in all flavors of IE because 75% of the people looking at this map are Windows users who cannot separate their hearts from Redmond.

I am posting this here on FreewayTalk to gather ideas on how best to accomplish this map task. Ultimately, those colored boxes will be light gray boxes filled with dealer name and address information, possibly with clickable website and email links.

Flash would be nifty but I haven’t the faintest idea how to use it, and I am not interested in forcing my users to get the required plugin either. So accomplishing what I want in a “normal Freeway manner” is desired here.

Ideally, I want users to click on a city name like Osaka and then have that block highlight in some way (like a rollover). Then when they click, it will present a dealer list of names, addresses, and URLs on that same page. Then they click on the box to make it vanish.

I look forward to your thoughts and advice.

Thank you,

James Wages

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

2

Nowhere near as stylish, but this was done using a base graphic with
map areas (drawn with the Map Area Path tool) and rollover action
triggering Target Show/Hide panels with WebYep functionality so that
the client can add/change dealer details.

I used a mouseover, so just move over a coloured area and the dealer
info appears. Works in IE6/7 and all other browsers I’ve tested.

In your case, simple graphics rollovers should work just as well as my
map areas.

HTH Colin

On 13 Nov 2009, at 08:42, JDW wrote:

I need to put a map on a page in my site that will ultimately take
users to unique information depending on where they click on the
map. I want that information to appear over the map on the same
page, if possible.

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

3

Colin, not sure what you did to get your “fade/trasition” effect, but I am finding that MS Internet Explorer versions 6, 7 and 8 are totally incompatible with the “Target Show/Hide Layer” Fade effect when used on my site. When I enable Fade, my slaves don’t show up at all in any version of IE. And when I disable Fade, it starts working again.

Of course, I don’t have any problem at all in FireFox or Safari for Windows or Mac. But I absolutely must get this to work in IE first and foremost.

I can get it to work without any effects at all, but it really does look terrible. Your page has a fade effect though. And I confirmed your page works in IE 6, 7 and 8 (although it does not look as expected in IE 6).

I also find it odd that when I enable the “Fade” effect in my even one “Target Show/Hide Layer” item, my Safari style search bar (at the bottom left of my site), breaks. Simply disabling Fade gets my Safari search working again, as well as gets the page working in all flavors of IE.

Further thoughts on what is happening would be appreciated.

Thank you!

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

4

One more thing…

I just noticed that the Hide Slaves (alternate) action works as expected on Graphic items but not on HTML items. Here is the action:

http://www.actionsforge.com/actions/view/166-hide-slaves-alternate

I want to use a Rollover trigger that when clicked will make an HTML item appear and also disappear with a subsequent click. I can do that right now by applying the “Target Show/Hide Layer” action to the HTML item and setting Restore to Toggle. But in addition to this, I also want to empower the user to make the HTML item vanish when they click on that same HTML item. I thought that the Hide Slaves (alternate) action would work, as it works perfectly on graphic items. But sadly, when I setup the Hide Slaves (alternate) action on my HTML item, clicking that HTML item doesn’t do anything.

How can I make that HTML item vanish when I click on it?

Thank you,

James

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

5

James, you will find the fade effect in the Target Show/Hide Layer
Action itself. Just click on ‘Effect’ in the Action window and chose
‘Fade’, then set the ‘Duration’ (I use between 0.5 and 0.7 usually).

The information panels to which the Action is attached are all HTML
containers with an inline graphic, text and WebYeb Actions.

As far as IE6 is concerned, I do now how it looks, but I no longer
test for this, unless specifically asked - it’s about time that
version was wiped off the scene!

Colin

On 16 Nov 2009, at 07:52, JDW wrote:

Colin, not sure what you did to get your “fade/trasition”
effect, … (although it does not look as expected in IE 6).

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

6

Colin, perhaps you misunderstood my second from the last post. I am well aware of the Effect: Fade setting in the Actions palette for “Target Show/Hide Layer.” And it was that very fade that I spoke of when I said this:

I also find it odd that when I enable the “Fade” effect in 
my even one “Target Show/Hide Layer” item, my Safari
style search bar (at the bottom left of my site), breaks.
Simply disabling Fade gets my Safari search working
again, as well as gets the page working in all flavors
of IE.

So it is clear to me that the Fade effect works on your site but not on mine. No doubt it is yet another conflict with the Safari search code I use on my site. If there are any action-writers reading this, I would love to hear your thoughts.

Anyway, I still look forward to hearing how I can make an HTML item vanish when I click on it. As I wrote in my previous post, Hide Slaves (alternate) doesn’t appear to be working at all on my HTML items (only on my Graphic items).

Thank you,

James

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

7

Time to call in the “Codebusters” - Walter, Keith, Dan, Todd, Tim.
Paul, Dave and a few others who always leave me amazed at what they
can do, how well they can explain it and how willing they are to help.

Colin

On 17 Nov 2009, at 05:51, JDW wrote:

Colin, perhaps you misunderstood my second from the last post. I am
well aware of the Effect: Fade setting in the Actions palette for
“Target Show/Hide Layer.” And it was that very fade that I spoke of
when I said this:

I also find it odd that when I enable the “Fade” effect in
> my even one “Target Show/Hide Layer” item, my Safari
> style search bar (at the bottom left of my site), breaks.
> Simply disabling Fade gets my Safari search working
> again, as well as gets the page working in all flavors
> of IE.

So it is clear to me that the Fade effect works on your site but not
on mine. No doubt it is yet another conflict with the Safari search
code I use on my site. If there are any action-writers reading
this, I would love to hear your thoughts.

Anyway, I still look forward to hearing how I can make an HTML item
vanish when I click on it. As I wrote in my previous post, Hide
Slaves (alternate) doesn’t appear to be working at all on my HTML
items (only on my Graphic items).

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

8

Well, I nevertheless appreciate your kindness in offering me recommendations, Colin.

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