# \[Pro\] BackGround Supersize and full screen

**URL:** <https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792>\
**Category:** Freeway\
**Created:** [December 4, 2012, 8:49pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792 "2012-12-04T20:49:24Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 4, 2012, 8:49pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/1 "2012-12-04T20:49:24Z")

</div>

Hello. Ive just made what I was looking for: an optional fullscreen, but, the site where Im implementing it has a Background Supersizer action, and now, it doesnt work. Can it be fixed in any way? The link is: [http://www.i-tek.es/demo/screen/](http://www.i-tek.es/demo/screen/) and the full screen enter when you press the green button and finish when you press the red one.

Thanks a lot.

[http://www.i-tek.es/demo/screen/](http://www.i-tek.es/demo/screen/)

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 4, 2012, 8:55pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/2 "2012-12-04T20:55:08Z")

</div>

and another thing, it only works in Safari… any idea?

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 4, 2012, 9:00pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/3 "2012-12-04T21:00:04Z")

</div>

and the last one: I need to have it well done. If someone knows how to fix it, we will appreciate it and pay for the work, of course.

Thanks again.

* * *

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

---

<div class="post-metadata">

**Author:** ![waltd](https://discourse.softpress.com/user_avatar/discourse.softpress.com/waltd/32/2720_2.png) [@waltd](https://discourse.softpress.com/u/waltd)\
**Post date:** [December 4, 2012, 9:19pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/4 "2012-12-04T21:19:44Z")

</div>

I would try to solve one problem at a time. First, get rid of the SuperSizer, and just apply your background to the page as normal. In the Styles palette, create a new style with the Tag set to body and nothing in the Name field. Click the Extended button and add the following name/value pair:

- Name: background-size
- Value: cover

Then test your page. Ignore the fact that only modern browsers can see the background covering the window regardless of size. Make sure that your full screen effect works.

Now you can add a polyfill to cover older browsers. Apply the Protaculous Action to the page, and choose prototype-packed from the Library picker. Click the top Function Body button and paste in the following code:

> <https://gist.github.com/walterdavis/4208778>

That should get the rest of the browsers to sit up and bark. Note that the effect will not be a perfect match for background-size:cover – it’s a more simplistic “squash to fit” approach, in keeping with the low-tech browsers that require it.

Walter

On Dec 4, 2012, at 3:55 PM, rakeljuice wrote:

> and another thing, it only works in Safari… any idea?
> 
> * * *
> 
> freewaytalk mailing list  
> email@hidden  
> Update your subscriptions at:  
> [http://freewaytalk.net/person/options](http://freewaytalk.net/person/options)

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 4, 2012, 9:37pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/5 "2012-12-04T21:37:28Z")

</div>

Hello Waltd!! Thanks a lot for your help. Background works with this method, not for epileptic people in Safari, because it flashes a lot, but it works. The Protaculous Action is magical, isnt it? Its is the second time you told me to use it to fix something…

And works at the time with the full screen mode but only in Safari. In IE it doesn work, an in Firefox, it gives a blank page with the text: [object Object]. The full screen method I used is in here: [GitHub - code-lts/jquery-fullscreen-plugin: This jQuery plugin provides a simple to use mechanism to control the new fullscreen mode of modern browsers](https://github.com/kayahr/jquery-fullscreen-plugin)

Any way to make it working in all browsers?

When I said that we can pay for the job was seriously. I dont know how much time can someone spend in that.

Thanks again.

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 4, 2012, 9:57pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/6 "2012-12-04T21:57:11Z")

</div>

Well, I have test without a freeway page, in a blank one, and both fullscreen methods work in Firefox and Safari (not in IE, but I think this one is a world apart…)

Test are :  
[http://www.i-tek.es/demo/prueba1/](http://www.i-tek.es/demo/prueba1/)  
[http://www.i-tek.es/demo/prueba2/](http://www.i-tek.es/demo/prueba2/)

But cant make it works together with others in my freeway page…

* * *

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

---

<div class="post-metadata">

**Author:** ![waltd](https://discourse.softpress.com/user_avatar/discourse.softpress.com/waltd/32/2720_2.png) [@waltd](https://discourse.softpress.com/u/waltd)\
**Post date:** [December 4, 2012, 11:13pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/7 "2012-12-04T23:13:39Z")

</div>

On Dec 4, 2012, at 4:37 PM, rakeljuice wrote:

> Hello Waltd!! Thanks a lot for your help. Background works with this method, not for epileptic people in Safari, because it flashes a lot, but it works.

This script should not fire in Safari, because it has the background-size property. Have a look at [http://cmi.walterdavisstudio.com](http://cmi.walterdavisstudio.com) to see it in action. (Work in progress, not final art.)

> The Protaculous Action is magical, isnt it? Its is the second time you told me to use it to fix something…
> 
> And works at the time with the full screen mode but only in Safari. In IE it doesn work, an in Firefox, it gives a blank page with the text: [object Object]. The full screen method I used is in here: [GitHub - code-lts/jquery-fullscreen-plugin: This jQuery plugin provides a simple to use mechanism to control the new fullscreen mode of modern browsers](https://github.com/kayahr/jquery-fullscreen-plugin)

There’s your problem right there. You can’t mix Prototype and jQuery in the same page (you can, but it’s a very bad idea, like dripping nitric acid into glycerin in your kitchen while smoking).

> Any way to make it working in all browsers?

> **[Full Screen API | Can I use... Support tables for HTML5, CSS3, etc](https://caniuse.com/fullscreen)**
>
> "Can I use" provides up-to-date browser support tables for support of front-end web technologies on desktop and mobile web browsers.

Depends a lot on what you mean by all browsers.

Walter

> When I said that we can pay for the job was seriously. I dont know how much time can someone spend in that.
> 
> Thanks again.
> 
> * * *
> 
> freewaytalk mailing list  
> email@hidden  
> Update your subscriptions at:  
> [http://freewaytalk.net/person/options](http://freewaytalk.net/person/options)

* * *

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

---

<div class="post-metadata">

**Author:** ![waltd](https://discourse.softpress.com/user_avatar/discourse.softpress.com/waltd/32/2720_2.png) [@waltd](https://discourse.softpress.com/u/waltd)\
**Post date:** [December 4, 2012, 11:18pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/8 "2012-12-04T23:18:51Z")

</div>

You might want to look at this, which doesn’t require jQuery to work: [GitHub - sindresorhus/screenfull: Simple wrapper for cross-browser usage of the JavaScript Fullscreen API](https://github.com/sindresorhus/screenfull.js)

Walter

On Dec 4, 2012, at 4:37 PM, rakeljuice wrote:

> Hello Waltd!! Thanks a lot for your help. Background works with this method, not for epileptic people in Safari, because it flashes a lot, but it works. The Protaculous Action is magical, isnt it? Its is the second time you told me to use it to fix something…
> 
> And works at the time with the full screen mode but only in Safari. In IE it doesn work, an in Firefox, it gives a blank page with the text: [object Object]. The full screen method I used is in here: [GitHub - code-lts/jquery-fullscreen-plugin: This jQuery plugin provides a simple to use mechanism to control the new fullscreen mode of modern browsers](https://github.com/kayahr/jquery-fullscreen-plugin)
> 
> Any way to make it working in all browsers?
> 
> When I said that we can pay for the job was seriously. I dont know how much time can someone spend in that.
> 
> Thanks again.
> 
> * * *
> 
> freewaytalk mailing list  
> email@hidden  
> Update your subscriptions at:  
> [http://freewaytalk.net/person/options](http://freewaytalk.net/person/options)

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 5, 2012, 12:28pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/9 "2012-12-05T12:28:21Z")

</div>

I think I got it!! Thanks a lot.

I did:  
1st. start from a blank document  
2nd. make the style for the background  
3rd. use the sindresorhus files for the full screen in my page: copy inbody all what I need from his index, and put the .js in the server, and make the buttons  
4th. Insert he vertical align action  
5th. insert a rollover button  
6th and I have no protacolus action used

by the moment, it works. I hope it will work when I will make a form…

Thanks again.

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 5, 2012, 12:31pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/10 "2012-12-05T12:31:55Z")

</div>

test link [http://www.i-tek.es/demo/screen/](http://www.i-tek.es/demo/screen/)

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 5, 2012, 5:27pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/11 "2012-12-05T17:27:44Z")

</div>

Hello again. Now Ive added a carousel and it doesnt work. Ive readen in other recent post that JQuery is not compatible with carousel, but at last, my fullscreen is not JQuery…

Is any way to fix it, using the marvelous protacolous action, perhaps?

Thanks

* * *

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

---

<div class="post-metadata">

**Author:** ![waltd](https://discourse.softpress.com/user_avatar/discourse.softpress.com/waltd/32/2720_2.png) [@waltd](https://discourse.softpress.com/u/waltd)\
**Post date:** [December 5, 2012, 5:32pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/12 "2012-12-05T17:32:03Z")

</div>

Link please? Your last link shows jQuery and screenful.js. Do you have a link to your working screen?

Walter

On Dec 5, 2012, at 12:27 PM, rakeljuice wrote:

> Hello again. Now Ive added a carousel and it doesnt work. Ive readen in other recent post that JQuery is not compatible with carousel, but at last, my fullscreen is not JQuery…
> 
> Is any way to fix it, using the marvelous protacolous action, perhaps?
> 
> Thanks
> 
> * * *
> 
> freewaytalk mailing list  
> email@hidden  
> Update your subscriptions at:  
> [http://freewaytalk.net/person/options](http://freewaytalk.net/person/options)

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 5, 2012, 5:47pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/13 "2012-12-05T17:47:25Z")

</div>

yes, sorry. [http://www.i-tek.es/demo/zarzuela/producciones.html](http://www.i-tek.es/demo/zarzuela/producciones.html)

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 5, 2012, 5:49pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/14 "2012-12-05T17:49:12Z")

</div>

but as it gives the error when publish, the carrousel appears extrange, with all the panes at view

* * *

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

---

<div class="post-metadata">

**Author:** ![waltd](https://discourse.softpress.com/user_avatar/discourse.softpress.com/waltd/32/2720_2.png) [@waltd](https://discourse.softpress.com/u/waltd)\
**Post date:** [December 5, 2012, 6:13pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/15 "2012-12-05T18:13:04Z")

</div>

Oh, I didn’t get that. So you never make it through publishing? Can you quote the error message that you see?

Walter

On Dec 5, 2012, at 12:49 PM, rakeljuice wrote:

> but as it gives the error when publish, the carrousel appears extrange, with all the panes at view
> 
> * * *
> 
> freewaytalk mailing list  
> email@hidden  
> Update your subscriptions at:  
> [http://freewaytalk.net/person/options](http://freewaytalk.net/person/options)

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 5, 2012, 6:26pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/16 "2012-12-05T18:26:55Z")

</div>

When publish first it says that action has javascript error, and lists all the pane and button carousel items. After, in the actions palette it says javascritp error, can clear the error but doesnt work. You publish again and it says that is up to you, but the carousel action is not being published. I can send you files if you want.

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 5, 2012, 6:33pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/17 "2012-12-05T18:33:09Z")

</div>

I got this last time I tried:

www.i-tek.es/demo/screen/01.jpg  
www.i-tek.es/demo/screen/02.jpg  
www.i-tek.es/demo/screen/03.jpg  
www.i-tek.es/demo/screen/04.jpg  
www.i-tek.es/demo/screen/05.jpg

it looks like the error, but it doesnt allow copy test, so I have capture the window. In 03 there is a red line.

* * *

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

---

<div class="post-metadata">

**Author:** ![waltd](https://discourse.softpress.com/user_avatar/discourse.softpress.com/waltd/32/2720_2.png) [@waltd](https://discourse.softpress.com/u/waltd)\
**Post date:** [December 5, 2012, 6:34pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/18 "2012-12-05T18:34:02Z")

</div>

I doubt the error would duplicate here. Could you please try the following:

1. Make sure you have the very latest version of the Action. Check at ActionsForge. While you’re at it, make sure you also have the latest version of Freeway Pro.
2. Go through the entire document, and remove all Protaculous, Carousel, Carousel Pane, Carousel Tab and Carousel Button Actions – everything Carousel related – from every element in the entire document.
3. Publish once (you don’t have to upload, just publish – this clears the Action caches in the document itself).
4. Go back through the document and re-build one of the Carousel pages. Test to make sure it works before doing the rest.

Let me know how that goes. You can also test the basic Action by closing all documents, creating a new blank document, and building up a test page to be sure that the Action works on your Mac. It should, as long as you have the latest versions of everything.

Walter

On Dec 5, 2012, at 1:26 PM, rakeljuice wrote:

> When publish first it says that action has javascript error, and lists all the pane and button carousel items. After, in the actions palette it says javascritp error, can clear the error but doesnt work. You publish again and it says that is up to you, but the carousel action is not being published. I can send you files if you want.
> 
> * * *
> 
> freewaytalk mailing list  
> email@hidden  
> Update your subscriptions at:  
> [http://freewaytalk.net/person/options](http://freewaytalk.net/person/options)

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 5, 2012, 6:56pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/19 "2012-12-05T18:56:58Z")

</div>

ok, my freeway is 5.5 and I downloaded and reinstalled the action. Althougt the action Protacolus it say is of August, when you download it the file says that is for 30 April, like the other I had.

Well, close, reinstalled and make a new blank site. Try carousel, and it works.

Go bak to my site, delete the page and make a new one, and when I export it says the same. The same line marked in red as at

www.i-tek.es/demo/screen/03.jpg

These are my results. What do you think? Thanks.

* * *

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

---

<div class="post-metadata">

**Author:** ![rakeljuice](https://discourse.softpress.com/letter_avatar_proxy/v4/letter/r/b38774/32.png) [@rakeljuice](https://discourse.softpress.com/u/rakeljuice)\
**Post date:** [December 5, 2012, 7:02pm UTC](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792/20 "2012-12-05T19:02:16Z")

</div>

Two things are conflicting I think: full screen and vertical alignment Action.

In my blank site I have the carousel working. If I add the vertical Alignment Action it gives the error.

And if I had the carousel working and add the full screen code in body, it gives the error as well.

* * *

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

[Next page](https://discourse.softpress.com/t/pro-background-supersize-and-full-screen/15792.md?page=2)