graceful degradation. Check CSS support

Discussion in 'Javascript' started by petermichaux@gmail.com, Oct 6, 2006.

  1. Guest

    Hi,

    I'm trying to do the right thing. I currently have a page that doesn't
    have any JavaScript and the page works. The page works with CSS on or
    off. Now I would like to add some JavaScript to enhance the page. The
    JavaScript will rearrange some of the DOM and use CSS.

    I am willing to put in the effort to try to ensure that the JavaScript
    doesn't do anything if necessary JavaScript support for full
    functionality is not available. This seems like a difficult task. I
    will do the DOM rearranging onload but before doing this rearranging I
    will have to check that even the code in the event handlers will work.
    Like I will have to do something like this

    if ( /* check every function I need is available */ ) {
    // All my JavaScript here
    }

    Is the best way to do this?

    It would be an equal failure if the JavaScript does anything if the CSS
    is disabled. Can I check that the CSS is on?

    Thank you,
    Peter
    , Oct 6, 2006
    #1
    1. Advertising

  2. wrote:
    <snip>
    > I am willing to put in the effort to try to ensure that
    > the JavaScript doesn't do anything if necessary JavaScript
    > support for full functionality is not available. This seems
    > like a difficult task. I will do the DOM rearranging onload
    > but before doing this rearranging I will have to check that
    > even the code in the event handlers will work. Like I will
    > have to do something like this
    >
    > if ( /* check every function I need is available */ ) {
    > // All my JavaScript here
    > }
    >
    > Is the best way to do this?


    That looks like a "gateway" test on initialisation, which is a completely
    viable strategy for achieving clean degradation in may circumstances. It
    seems a bit extreme to write "All my JavaScript here", as you would not
    want all your code there (function declarations and the like), only the
    code that starts things off.

    > It would be an equal failure if the JavaScript does anything
    > if the CSS is disabled. Can I check that the CSS is on?


    That would depend a great deal on what CSS you were interested in. If,
    for example, you were interested in absolute positioning, in browsers
    that allowed the positions of elements to be determined (or estimated)
    you could define CSS to put an element in one location (say an empty DIV
    at co-ordinates 0, 0, but defined in the mark-up such that it would never
    be in that position if flowed without CSS. Then onload you could look at
    the element's position and if it were not where it would be expected to
    be if CSS was applied deduce that CSS positioning was not being applied
    to the document.

    Richard.
    Richard Cornford, Oct 7, 2006
    #2
    1. Advertising

  3. Guest

    напиÑав:
    > Can I check that the CSS is on?
    > Thank you,
    > Peter


    I think yo can use currentStyle and runtimeStyle for IE and
    getComputedStyle() for Mozilla. Just try to read compured style and if
    some specific style property != value set in CSS then CSS is off (but I
    think it is almost impossible situation when JS is on and CSS is off).

    Val Polyakh
    http://trickyscripter.com
    , Oct 7, 2006
    #3
  4. Guest

    Hi Richard,

    Thanks for the reply.


    Richard Cornford wrote:
    > wrote:
    > <snip>
    > > I am willing to put in the effort to try to ensure that
    > > the JavaScript doesn't do anything if necessary JavaScript
    > > support for full functionality is not available. This seems
    > > like a difficult task. I will do the DOM rearranging onload
    > > but before doing this rearranging I will have to check that
    > > even the code in the event handlers will work. Like I will
    > > have to do something like this
    > >
    > > if ( /* check every function I need is available */ ) {
    > > // All my JavaScript here
    > > }
    > >
    > > Is the best way to do this?

    >
    > That looks like a "gateway" test on initialisation, which is a completely
    > viable strategy for achieving clean degradation in may circumstances. It
    > seems a bit extreme to write "All my JavaScript here", as you would not
    > want all your code there (function declarations and the like), only the
    > code that starts things off.


    It looks like Gmail uses a gateway script* to direct users to various
    versions of their sites: without JavaScript, with JavaScript capable of
    AJAX, and a separate interface for cell phones. So instead of
    gracefully degrading individual pages they have a gracefully degrading
    site. Perhaps this will become a more important version of degradation
    as modern browsers gain more features and writing a single page for
    various browser vintages becomes more difficult and more limiting
    compared with what is possible in modern browsers.

    * You can see this script by disabling JavaScript and then going to
    <URL: http://gmail.com> and looking at the source.


    > > It would be an equal failure if the JavaScript does anything
    > > if the CSS is disabled. Can I check that the CSS is on?

    >
    > That would depend a great deal on what CSS you were interested in. If,
    > for example, you were interested in absolute positioning, in browsers
    > that allowed the positions of elements to be determined (or estimated)
    > you could define CSS to put an element in one location (say an empty DIV
    > at co-ordinates 0, 0, but defined in the mark-up such that it would never
    > be in that position if flowed without CSS. Then onload you could look at
    > the element's position and if it were not where it would be expected to
    > be if CSS was applied deduce that CSS positioning was not being applied
    > to the document.


    Great suggestion. Thanks.

    Peter
    , Oct 10, 2006
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Boo R. Ghost

    Performance degradation

    Boo R. Ghost, May 11, 2004, in forum: ASP .Net
    Replies:
    2
    Views:
    408
    Boo R. Ghost
    May 12, 2004
  2. Chakra

    Degradation

    Chakra, Apr 21, 2005, in forum: ASP .Net
    Replies:
    3
    Views:
    502
    Aquila Deus
    Apr 23, 2005
  3. Robert Brown
    Replies:
    5
    Views:
    464
    Harald Hein
    Jul 31, 2003
  4. Paul F. Johnson

    Safe level of website degradation

    Paul F. Johnson, Jun 24, 2003, in forum: HTML
    Replies:
    3
    Views:
    1,138
    Andrew Tang
    Jun 24, 2003
  5. Aaron Watters

    graceful degradation : is it degrading?

    Aaron Watters, Nov 2, 2009, in forum: Python
    Replies:
    2
    Views:
    309
    Terry Reedy
    Nov 2, 2009
Loading...

Share This Page