zoomed window (how-to question

Can anyone tell me how to achieve the same affect as can be seen here on apple’s site? iTunes Movie Trailers

What you see is three button (small/medium.large), and when you click on either of them, a half-transparant window zooms to the centre of the window. it’s a really nice effect.

thanks!


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

hi
Apple are using something similar to this
http://orderedlist.com/articles/fancyzoom-meet-prototype

this version of zooming box is pretty close and uses the already built in Framework that freeway now uses for it’s effects.

max


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

thanks for the quick reply, much appreciated.

any idea how to implement this in freeway? or don’t I need all that code?


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

Oooh, nice find, I’d forgotten this one. Must hurry up and finish my
projects so I can roll this into an Action…

Walter

On Feb 6, 2009, at 1:44 AM, max wrote:

hi
Apple are using something similar to this
http://orderedlist.com/articles/fancyzoom-meet-prototype


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

Unfortunately its not straight forward, but I can have a go later on in creating an example. I am a bit pushed until later so as long as you don’t mind waiting then I shall have a go at knocking something up a bit later

max


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

I had a quick play with the standard Show/Hide Actions, and found that
while you can easily make things appear and disappear, there’s a hitch
to this layout. Getting them to appear directly over top of the
trigger element is easy, getting them to hide again afterward is
nearly impossible, particularly if you have more than one trigger
element “under” the zoomed image.

You can build a similar effect using the Protaculous Action, but it
takes a little work.

###Page
Apply Protaculous to the page, select scriptaculous-packed from the
Library menu, and enter the following in the top Function Body:

$$('div.zoom').invoke('hide');

That hides any element on the page that has class=“zoom” applied to it.

###Zoom Item
Draw a large graphics box, import your zoomed image into it, and
select Item / Extended from the main menu. Click on the DIV segment of
the dialog, click New, and enter

name value
class zoom

in the dialog.

Make note of the name that Freeway has given this element (left-most
pane of the Inspector) – item4 in this example.

Apply the Observer Action (part of Protaculous) to the zoomed image,
set the library to scriptactulous-packed, set the event to ‘click’,
and in the Function Body, enter the following:

this.fade();

###Trigger Element
Draw a small graphics box elsewhere on your page, fill it with your
thumbnail image, apply Observer to it, set the library to
scriptaculous-packed, set the event to ‘click’ and in the Function
Body, enter the following:

$('item4').appear();

Send the trigger element to back, and position it under your zoomed
image. Both elements must be layers, and neither may be a child of the
other, or the effect will fail.

Preview or Preview in a browser, and when the page first loads, the
only thing you will see will be the trigger element. When you click
it, the zoom image will fade up (not quite as sexy as a real zoom, but
a good analogue). When you click the zoomed image, it will fade away.

Walter

On Feb 6, 2009, at 3:49 AM, macsterdam wrote:

thanks for the quick reply, much appreciated.

any idea how to implement this in freeway? or don’t I need all that
code?


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 again for all the help - I haven’t quite got this to work yet, but that’s because I know next to nothing about coding. Will give it another go today.

Thanks again!!


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

Oooh, nice find, I’d forgotten this one. Must hurry up and finish my projects so I can roll this into an Action…

Walter, a Fancy Zoom action, now were talking. I have been trying to get that little bugger to work but quite frankly I’m not smart enough. I’m definitely looking forward to Walter’sFancyZoom action goodness.

Cheers, Marcel


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