[Pro] iTunes Like Scroll for images?

Hello,

I am new to Freeway.

I would like to make a scrolling image bar with links similar to that which can be found in the “Movie” section of the iTunes Store.

Does anyone know how to achieve this design?

Jamie


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

Do you mean the header with the fading sequential images on the left with the vertically scrolling images on the right.

If so then you could do this with the Carousel and ScriptyFader actions side by side.

This page has a vertical Carousel which can be set to auto rather than manual operation http://www.deltadesign.co/examples/storyboard.html

Similarly this page uses ScriptyFader which also can do an auto mode http://www.deltadesign.co/examples/scriptyfader.html

David


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

I mean the “New to Rent or Own” Scroller.


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

Carousel in horizontal mode will do that for you.

D


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

Make the following “sandwich”:

Draw an HTML box where you want the images to appear, sized so that
you can see N number of images, plus a little bit of the next image,
just so it is evident what is going on. In the Inspector, set the
Overflow to Auto. Be sure that the box is taller than your tallest
image by at least 24px.

Double-click inside that box and use Insert / HTML item to add an
inline HTML box inside it. Use the Inspector to make this box wide
enough to hold all of your images, and tall enough for one image. This
element will appear to “hang out” of the first box you drew, but this
will be hidden in the real page.

Double-click inside this inner box, and add as many image boxes as you
need. Insert your images into them, scale and style them how you like.

Preview, and you should see the effect you’re after.

Walter

On Feb 21, 2011, at 3:45 PM, Jamie Hall wrote:

I mean the “New to Rent or Own” Scroller.


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

I see it now - it looks quite different on the iPad. No scroll bars!

Uses a Carousel type mechanism.

D


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

On 21 Feb 2011, 7:55 pm, waltd wrote:
In the Inspector, set the
Overflow to Auto.

How do I set the Overflow to Auto?


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

With your HTML item selected look in the Inspector, 1st Tab and down to the Dimensions section.

The options are in there Auto, Visible etc.

David


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

On 28 Feb 2011, 10:58 pm, DeltaDave wrote:

With your HTML item selected look in the Inspector, 1st Tab and down to the Dimensions section.

The options are in there Auto, Visible etc.

David

Weird. I don’t actually see it. In dimensions all I have is the sizing options, padding and wrap.


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

It needs to be a layered item - green border.

David


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

Let me just say so far you’ve been a great help David. I think I’m down to my last couple of questions …

When I add the new items it gives me a scroll bar which scrolls up and down, not left to right and can I change the look of the scroll bar?


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

That is because you have added the items on top of each other rather than in a line - no returns between items!

Remember the instructions:

Double-click inside that box and use Insert / HTML item to add an inline HTML box inside it. Use the Inspector to make this box wide enough to hold all of your images, and tall enough for one image. This element will appear to “hang out” of the first box you drew, but this will be hidden in the real page.

Double-click inside this inner box, and add as many image boxes as you need. Insert your images into them, scale and style them how you like.

D


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

I must be completely out to lunch. It just doesn’t seem to want to work for me.

When I make the second box which you say will hang out of the first HTML item I get an error message saying “The value entered is out of range and has been constrained”. I understand why this has to be there but I’m not sure what’s preventing it from continuing past the constrained range.

Man I feel like a newb.


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

What version of Freeway (Pro/Express and number version) are you
using? What HTML Level is this page set to. Do you have CSS
Positioning layout on or Table Positioning? Is the outer box a layer
(checkbox in the Inspector). Did you double-click inside the first
box, see a text cursor, and then use Insert / HTML Item to add it?
When you’re trying to resize the inner box, are you using the
Inspector, or dragging a corner? The former should work, the latter
probably will not.

Walter

On Feb 28, 2011, at 9:36 PM, Jamie Hall wrote:

I must be completely out to lunch. It just doesn’t seem to want to
work for me.

When I make the second box which you say will hang out of the first
HTML item I get an error message saying “The value entered is out of
range and has been constrained”. I understand why this has to be
there but I’m not sure what’s preventing it from continuing past the
constrained range.

Man I feel like a newb.


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

There is another method for doing this that you may find easier - also an example FW5.5 file - http://www.deltadesign.co/examples/slider.html

Draw your initial ‘container’ HTML layered box where you want the images to appear sized so that you can see N number of images, plus a little bit of the next image. Set the Overflow to Auto.

Draw another layered box below the first (‘inner’ in my example) which will hold your images. Make it as wide as needs be to hold them all and tall enough for the height of one.

Click inside this until you get the flashing cursor and Insert>Graphic Item. Resize this to the height/width of your image(s) and add a bit of right padding so it stays away from the second one which you can insert by copying the first one and then pasting in as many times as you need. Once the graphic containers are there you can import your pics into them.

Now that you have all the images in the ‘inner’ box. then select it and drag it over the top of the ‘container’ box while holding the spacebar down. The border of the ‘container’ box will turn blue and you can then let go and ‘inner’ will be inside ‘container’.

All you need do now is reduce the width of ‘container’ until it is just big enough to hold enough of your images in view.

David


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