Take the 2-minute tour ×
Web Applications Stack Exchange is a question and answer site for power users of web applications. It's 100% free, no registration required.

I have the following JSFiddle, http://jsfiddle.net/brantolsen/ejUWt/. It does the simple task of changing from full screen to non-full screen each time the body is clicked. This works correctly when all content is copied into a local web page and is correct according to the documentation found here. However, on JSFiddle nothing happens.

Is is possible to make example code on JSFiddle go full screen?

Please note that I do not mean viewing the result as full screen, but getting the javascript full screen commands working.

share|improve this question

5 Answers 5

You view the result in full screen like this -

http://jsfiddle.net/brantolsen/ejUWt/embedded/result/

Just click the share button on top -

enter image description here

share|improve this answer
    
Sorry, I was unclear with what I meant by full screen. I meant that I could not get the Javascript full screen api to work in jsfiddle not how to view the result as full screen. Thanks anyways. –  Brant Olsen May 9 '12 at 21:56
1  
Understood. JsFiddle uses iframes to show output. In fact, all those 4 boxes are iframes. So, there can be no regular way in which you can achieve this. –  Bibhas May 10 '12 at 4:32
2  
Although maybe unrelated to the original post, I just Googled for exactly this. Couldn't find the full screen view on jsfiddle. –  Wesley Murch Dec 4 '12 at 17:35
    
Exactly @Wesley, this answer is much more useful than the one OP was looking for! ;-) –  Tomas Jun 28 '13 at 7:43
    
Note that this "Share" button does not appear until after you save the JSFiddle once, by clicking the "Save" button. –  Rory O'Kane Jul 25 at 18:31
up vote 0 down vote accepted

Found the reason after playing around with Chrome and inspect element. The result code is placed inside an iframe which disallows full screen commands.

I was able to temporarily work around this by adding mozallowfullscreen and webkitallowfullscreen, found at https://developer.mozilla.org/en/HTML/Element/iframe, to the iframe through the use of firebug and Chrome's debug tools.

However, it does not look like JSFiddle will allow you to customize the iframe that the code is wrap in at this time.

share|improve this answer

jsfiddle doesn't support full screen. you can try this instead... http://liveweave.com and then click "Edit"...u will a complete full screen editor

share|improve this answer

I always use jsbin.com for mobile pages because jsbin doesn't use an iframe when you go full screen, and the UI works a little bit better from mobile devices. Also it has good auto update as you edit on PC it auto refreshes the page on mobile - nice.

Click share and cut and paste the URL to go full screen (or just remove /edit).

I strongly recommend setting up a free account - shorter URLs, saves your pages, and the pages kind of expire if you don't.

share|improve this answer

I think the other respondents to your thread looked at the iframe (crossdomain) issues and ignored the question.

Another awesome JSFiddle user, Jennifer Perrin, answered more than half your question in her post "Get current page URL and title with jQuery".

All that remains for you to do is to apply some logic on the URL returned and fashion it into a functional http://jsfiddle.net/[userid]/[postid]/embedded/result/ link in an anchor that changes it's href to toggle fullscreen.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.