Full background slideshow effect

Hi!
I wonder if someone could point me out in right direction on how to achieve the full background images with slideshow effect like on this page

I tried to view source, but i am lost in jquery files.
I wonder if it is possible to achieve such effect in Freeway.

Thanks a lot


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

I don’t think that this method actually uses proper background images at all. ie not a page background - rather a Div background

Have a look at http://plugins.jquery.com/project/SuperBGImage

David


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

Thanks a million.
This is exactly what I am looking for.
Now I only need to know how to implement jquery into Freeway :slight_smile:

Any tutorials for that?


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

There is also the caveat that Jquery doesn’t play nicely with the Script/Protaculous based FW actions so shouldn’t be mixed on the same page.

D


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

OK.
Point taken.
Thanks again
Only Protaculous? or any other actions?


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

If you use jQuery effects in Freeway, you have all sorts of problems
waiting for you if you use any of the built-in effects. Prototype (the
JS library that Freeway uses) and jQuery are not compatible, plus
using both on the same page just makes the page that much larger
(these are not small bits of code) for no additional benefit.

To make a rotating slideshow out of your background images, first you
need to apply one background image to the page, then upload some
additional ones. Use Upload Stuff or Extra Resources to upload these
additional images into your Resources folder. Then make a note of the
filenames of these images.

Apply Protaculous to the page, and choose prototype-packed from the
Library picker. Click on the top Function Body button in the Actions
palette, and paste in the following:

Be sure to adjust your background image filenames in the first line.
Put the original page background image in the first position, then
each additional image following that. This is a JavaScript Array, so
to add more elements, just use commas between elements, and be sure to
wrap the filename with a single-quote on each side. Spelling counts
here – you have to get this exactly the same as the files in your site.

Then preview in Freeway or a browser. You should see your first image,
then after 5 seconds, the next image should replace it. Since this is
a real page background, not a layered DIV, we can’t do the fancy
transitions between images. That’s certainly possible, but you give up
the benefits of a real background image when you do.

Walter

On Mar 9, 2011, at 4:05 PM, DeltaDave wrote:

I don’t think that this method actually uses proper background
images at all. ie not a page background - rather a Div background

Have a look at http://plugins.jquery.com/project/SuperBGImage

David


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

That’s absolutely terrific.
Thanks a lot guys.
I will try both methods and see.

About second method with - When I see a demo of SuperBGImage JS I notice that it somehow makes the image resize nicely to many web browser size, and I like it a lot , I do not know if it true to Protaculous action method?
Won’t I ended up with some un proportional image scale?

Anyway thanks a lot.


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

A page background cannot be resized. One size has to fit (or slip
around) all. You would need to do a different type of background,
which wouldn’t be a real page background, if you wanted to have it
resize to fit the window.

Walter

On Mar 9, 2011, at 5:08 PM, Vadim wrote:

That’s absolutely terrific.
Thanks a lot guys.
I will try both methods and see.

About second method with - When I see a demo of SuperBGImage JS I
notice that it somehow makes the image resize nicely to many web
browser size, and I like it a lot , I do not know if it true to
Protaculous action method?
Won’t I ended up with some un proportional image scale?

Anyway thanks a lot.


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 use the first method just extract and combine some JS from downloaded example DeltaDave suggested.
But I find out that it completely killed Transition FX action I used on the same page.

I almost certain it could be fixed, but its beyond my grasp.
If any one could help me - look at this demo.

http://www.stylapps.com/Test/index.html

The "loading portfolio” item should appears on page load and now it just sit there from the start.

I am greatly appreciate any help.

Thanks


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

This is what Dave and I were warning you about. You can’t mix Prototype and jQuery in the same page. All of the wizzy effects in Freeway rely on Prototype, so if you want to use jQuery for one thing, you’ll have to use it for everything. Try using the Prototype code in my Gist.

Walter


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

ok
thanks


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

Although you should be wary of mixing JavaScript libraries like this (adding to the overall page size, complexity, etc) you can get jQuery to play nicely with other libraries by adding jQuery.noConflict(); to the code;

<script type="text/javascript">  
			jQuery.noConflict();
			jQuery(function($){
				$.supersized({
			...

Regards,
Tim.

On 10 Mar 2011, at 15:06, waltd wrote:

This is what Dave and I were warning you about. You can’t mix Prototype and jQuery in the same page. All of the wizzy effects in Freeway rely on Prototype, so if you want to use jQuery for one thing, you’ll have to use it for everything.

FreewayActions.com - Freeware and commercial actions for Freeway Express & Pro.

Protect your mailto links from being harvested by spambots with Anti Spam.
Only available at FreewayActions.com

http://www.freewayactions.com


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

Hi all,

Sorry to bring up this old thread, however, I am looking into using jQuery in my freeway site. Specifically the SuperBGImage and was wondering if I could have some guidance of how to do this properly.

Thanks,

Seb


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

Will the FW actions not do this for you? Remember that mixing JS libraries on a FW page can lead to conflicts.

Also you would be better to start a new thread to get a better response.

David


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

It can be done with the FW action provided however, it doesn’t look as refined as the jQuery option. The conflicting is not a problem on this site.

I’ll start a new thread.

Seb


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

Did you look at the Background Supersizer action - example here http://www.deltadesign.co/fw_examples/background_super.html

D


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

I didn’t see this one. I’ll give it a go now.

Thanks,

Seb


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