Large before and after images with thumbnails

Freeway
1

Hi. This is my first post. I have a trial copy of Freeway and I’m trying to figure out if I can use it to build a “Before & Afters” retouching website. I want to have a group of thumbnails linked to larger images and then have each larger image have a rollover to show the “before”.

I’m trying to do this with Express, but I’m willing to go with Pro if Express can’t do this and Pro can.

I’ve figured out how to have a group of thumbnails linked to single larger images, and I’ve figured out how to have one large image link to another large image with a rollover, but I can’t figure out if it’s possible to have a group of thumbnails trigger a series of larger “before” images and then have a separate rollover for the larger image that triggers an “afters” image view.

Any help will be greatly appreciated.

Richard

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

2

I Richard I would say you are probably going to need Freeway pro for this, as I am fairly sure its going to need the ability to use layers /css. So I would probably download that one on trial. and start looking at using the slave rollover and targetshow/hidelayer actions.

kind regards max

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

3

Thanks Max! I’ll look into those actions and whether I need to rebuild in Pro.

I made something that works in Express, but it uses a separate duplicate page for each rollover and has the thumbnails refer to the page. This creates a lot of almost duplicate pages. Not too hard to make, but I’m concerned about whether the final code will be too complicated and susceptible to slowdowns or breaking.

Any thoughts?

Richard

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

4

On 26 Mar 2009, 6:49 am, max wrote:

I would say you are probably going to need Freeway pro for this, as I am fairly sure its going to need the ability to use layers /css. So I would probably download that one on trial. and start looking at using the slave rollover and targetshow/hidelayer actions.

kind regards max

Max, is “slave rollover” different from what’s now labeled just “rollover”? I think this (rollover) is the same in Express and Pro?

I’ve been trying to get my head around the targetshow/hidelayer action as this seems likely to help. I’m finding it hard- any tips?

Thanks again!

Richard

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

5

Try this little exercise for a simple gallery like the one at:

1 - For your large images, import the first one into a graphic box
and give it the Action Target Show/Hide Layer and set the parameters
to Initially: Hidden, Restore: Sticky, Effect: Fade. I use a Duration
of 0.8, but you can experiment to find what you prefer. Leave the
Target Group at Indigo and set the Target #: 1.

2 - Duplicate this image in the same position, double click on it to
bring up the Graphic dialog and locate the next image (re-scaling if
necessary). change the Target # to 2. Repeat for each new image,
incrementing the Target # each time, to build a stack of main images.

3 - For the thumbnail images, import into graphic boxes and give each
the Rollover Action setting the parameters for Mouseover: Item and
Target # to match the main image Target#.

4 - For a short cut, duplicate the first thumbnail the number of times
you need - spaced at regular intervals - and then double click on each
to locate a new image and change the Target#.

(You can also make thumbnails individually by copying and resizing/
resampling the main image before you apply the Action).

Once you are happy with your page you can always duplicate it and just
change the pictures for another gallery. Use the Site Panel to select
each layer and go to the Item Menu - Modify - Locate, to change the
main images. Just double click on the thumbnails to do the same.

You can also use a double image and/or Click on the thumbnail, so that
it changes colour or fades when selected

Be brave - experiment. That’s how you really learn Freeway.

Colin

On 26 Mar 2009, at 19:54, riccc123 wrote:

I’ve been trying to get my head around the targetshow/hidelayer
action as this seems likely to help. I’m finding it hard- any tips?

Thanks again!

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

6

ColinJA wrote:

Try this little exercise for a simple gallery like the one at:

I Need Web Hosting Mac friendly web hosting and domain registration
(clip)

Be brave - experiment. That’s how you really learn Freeway.

Colin

Thanks Colin that was very helpful. Now I have the thumbnails triggering the “before” picture and have a roll over for the “after”.

However, I can’t figure out how to have an initial image in the large picture area instead of a blank. I’ve tried a bunch of things, but keep breaking the rollovers. Can you (or anyone else, of course) help me with that?

Thanks again!

Richard

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

7

On 27 Mar 2009, at 02:40, riccc123 wrote:

However, I can’t figure out how to have an initial image in the
large picture area instead of a blank.

The simplest ay is to duplicate one of your images, without the Target
Show/Hide Action, and place it at the bottom level of the stack.

Or you could use a base image panel overlaid with the instruction of
what to do with the thumbnails and what they reveal.

Or (and I haven’t tried this yet - so it might break!) place second
stack of images below you main stack and use the Random Image or
Random Sequence Action

HTH Colin

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

8

The simplest ay is to duplicate one of your images, without the Target
Show/Hide Action, and place it at the bottom level of the stack.

HTH Colin

I got it to work! Since my target layer is actually a rollover of 2 images I needed to put a rollover group under my stack so it would show until a thumbnail was activated.

Thanks!

Richard

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