Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 13 of 13
  1. #1
    Regular Coder
    Join Date
    Oct 2010
    Posts
    157
    Thanks
    2
    Thanked 1 Time in 1 Post

    fullscreen through javascript

    Hi,
    well making a page fullscreen is one of my favorite topics but whenever I have thought of doing it, I have always received one answer and that is, it is only done with flash.
    For the first time today I saw one that is not done with flash, can someone tell me how exactly it is done, so I could atlast full my dream of using it ^^
    here is the image
    http://content.screencast.com/users/...04-13_0001.png

    and here is the link to the page where this fullscreen button exists.
    http://tutorialzine.com/2010/09/html...deshow-jquery/

  • #2
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,609
    Thanks
    0
    Thanked 645 Times in 635 Posts
    There is nothing on that page that makes it full screen or if there is it must only be working for you because either you are using an antiquated browser or have disabled some of the settings that prevent web pages interfering with your browser.

    If people want to view something full screen they will press the F11 key (or whatever alternative they have set up to use with their browser).
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #3
    Regular Coder
    Join Date
    Oct 2010
    Posts
    157
    Thanks
    2
    Thanked 1 Time in 1 Post
    Quote Originally Posted by felgall View Post
    There is nothing on that page that makes it full screen or if there is it must only be working for you because either you are using an antiquated browser or have disabled some of the settings that prevent web pages interfering with your browser.

    If people want to view something full screen they will press the F11 key (or whatever alternative they have set up to use with their browser).
    How can you talk like that man, I added a pic so you can see, there is nothing that is blocked on browser, why would I do that while I am trying to develop something and my all browsers are up to date.
    Kindly see the picture and then find that button, I have confirmed the button through, firefox, ie9, chrome
    I hope this is enough for testing to verify that the button that I am talking about exists.

  • #4
    Regular Coder Lerura's Avatar
    Join Date
    Aug 2005
    Location
    Denmark
    Posts
    894
    Thanks
    0
    Thanked 118 Times in 117 Posts
    When you click the button, and it goes fullscreen, you get the temporary message:
    "Press ESC to exit fullscreen"
    Which is a message from flashplayer.

    clicking the button triggers something that are flash!

  • #5
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,609
    Thanks
    0
    Thanked 645 Times in 635 Posts
    There is no Full Screen button showing anywhere on that page when I look at it.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #6
    Regular Coder Lerura's Avatar
    Join Date
    Aug 2005
    Location
    Denmark
    Posts
    894
    Thanks
    0
    Thanked 118 Times in 117 Posts
    Using firefox 11, I see the fullscreen button about 1cm below the bottom-left corner of the first image (just left of the tweet icon).

  • #7
    Regular Coder
    Join Date
    Oct 2010
    Posts
    157
    Thanks
    2
    Thanked 1 Time in 1 Post
    Quote Originally Posted by lerura View Post
    When you click the button, and it goes fullscreen, you get the temporary message:
    "Press ESC to exit fullscreen"
    Which is a message from flashplayer.

    clicking the button triggers something that are flash!
    I have find out what is it, it's based on html5, its not flash ^^ I am really glad that internet is now improving. It's the same thing that is these days used in html5 players, it's just that this site owner was smart he/she used it in site.
    I am making a games site so its a best option for me except that it has compatibility issues with old browsers

  • #8
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,609
    Thanks
    0
    Thanked 645 Times in 635 Posts
    Must be a bug in that version of Firefox - they wouldn't introduce something so annoying to 99% of visitors on purpose.

    Alternatively it might be one of those proposed HTML 5 features that they are trying out in that browser just so they can find out how annoying it is so as to have a proper explanation for why it gets dropped.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #9
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,037
    Thanks
    0
    Thanked 250 Times in 246 Posts
    I tried it in Chrome and looked at Developer tools and noticed this in Chrome user-agent stylesheet:

    Code:
    :-webkit-full-screen {
      background-color: white;
      z-index: 2147483647;
    }
    So I guess it's one of CSS3's new non-standard features (yet) and some browsers started to implement their own until it becomes standard later on.

    I also noticed fullscreen functionality in Facebook Photo slideshow recently.

    In my opinion, it's not annoying. The user is given a choice to do fullscreen or not and not forced to do it.

  • #10
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,292
    Thanks
    10
    Thanked 583 Times in 564 Posts
    it's called element.requestFullScreen()


    https://developer.mozilla.org/en/DOM...ll-screen_mode
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • #11
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,292
    Thanks
    10
    Thanked 583 Times in 564 Posts
    Quote Originally Posted by felgall View Post
    Must be a bug in that version of Firefox - they wouldn't introduce something so annoying to 99% of visitors on purpose.
    Alternatively it might be one of those proposed HTML 5 features that they are trying out in that browser just so they can find out how annoying it is so as to have a proper explanation for why it gets dropped.

    think outside the innerWidth box!

    if you think this is going to go away or is some kind of a bug, you are sorely mistaken. this isn't the first HTML5 feature that's gone un-noticed around here, and i fear it won't be the last. stick your head in the sand and use php for apps if you must, but the rest of us have bad-@ss apps to create. naysay elsewhere please.

    initially, requestFullScreen() was developed for the <video> tag, but it can also be great for <canvas> and even some <div>s.

    combined with the ability to unhinge the mouse from the pointer, it's the first indication that HTML5 is serious about games, multimedia, presentation software, data-view "screensavers" (like stock markets and weather), and many other applications that can use maximum screen real-estate.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • #12
    Gütkodierer
    Join Date
    Apr 2009
    Posts
    2,127
    Thanks
    1
    Thanked 426 Times in 424 Posts
    Quote Originally Posted by cryoffalcon View Post
    For the first time today I saw one that is not done with flash, can someone tell me how exactly it is done, so I could atlast full my dream of using it ^^
    There's a whole article on the fullscreen API on the very site you linked to in your original post: http://tutorialzine.com/2012/02/enha...ullscreen-api/
    .My new Javascript tutorial site: http://reallifejs.com/
    .Latest article: Calculators — Tiny jQuery calculator, Full-fledged OOP calculator, Big number calculator
    .Latest quick-bit: Including jQuery — Environment-aware minification and CDNs with local fallback

  • #13
    Regular Coder
    Join Date
    Oct 2010
    Posts
    157
    Thanks
    2
    Thanked 1 Time in 1 Post
    Well I don't think that people in the next generation would like to live without fullscreen world is changing and as said above we are not going to force users. Anyway I am going to use it for games (while keeping it optional for users).
    Thanks for your helpful replies I read the article, it shows that It is not implemented by all browsers up till now, so I have to find a way to make it trigger with f11 so the browsers which support real fullscreen (the one like flash) become fullscreen for real otherwise they can remove the browsers extra panels and show entire screen (which actually f11 do) ^_^


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •