[Pro] Backdraft flexible hero image

Freeway
1

Hi,

I’m using the excellent Backdraft template to build by first responsive site. I wanted the header to fill the entire browser width which I’ve managed by following the informative tutorial on Caleb’s site, but now I’d like a large flexible hero image to fill the full width of the browser, and scale when the browser is resized (in fact just like Justins excellent site at http://www.easthalldesign.com

After a lot of head scratching I just can’t figure it out. If anyone can shed any light on it I’d really appreciate it. I tried playing around with the Hero Image Module but can not replicate how it works on Justin’s site.

Additionally, could I use an Exhibeo slider in there or does this need to be a WOW slider?

Thanks loads,

Neil.

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

2

Neil,

Here is an example Freeway file: http://cl.ly/QqXa.

Now, the steps:

  1. Follow steps 1 and 4 from here.

  2. Double-click in the page area to get a blinking text cursor. From the top bar, choose “Insert > Graphic Item”.

  3. Pull the graphic item out to the full width of the page in Freeway.

  4. With the graphic item selected, go to “File > Import” in the top bar. Make sure that you import it as a pass-though (checkbox in the import dialog).

  5. Right-click on the image, and choose “Extended”. Add a new entry with style for the name, and width: 100%; height: auto; in the value field, like so:

  6. Click “OK” and test!

If you run into any problems, just holler.

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

3

To further clarify; WOW Slider handles the scaling automagically. The directions above are how to achieve that same scaling effect with a browser-width image.

Justin’s site uses WOW Slider, which is responsive-friendly. Also, Exhibeo’s “Slide” theme is not responsive. More info here

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

4

Hi Caleb,

Sorry for the late reply. Thank you LOADS for this, it’s greatly appreciated, and having the Freeway doc to see exactly how it is done is really useful.

I’m off for some sleep so will try this in the morning with my design.

Brilliant, thanks :slight_smile:

Neil.

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