Results 1 to 3 of 3

Thread: noscript + html comments

  1. #1
    Join Date
    Apr 2008
    Location
    So.Cal
    Posts
    3,643
    Thanks
    63
    Thanked 517 Times in 503 Posts
    Blog Entries
    5

    Default noscript + html comments

    hi all,

    I've been experimenting more lately with javascript. Because of my current clientele (corporate - read: old computers/browsers), I'm trying to keep everything as degrade-able as possible.

    In some cases, I need to hide stuff when there's no javascript - essentially, items that won't be used (and would be in the way) if javascript isn't on.

    I've been using noscript tags to hold html comments, like so:
    HTML Code:
    <noscript> <!-- </noscript>
       <div>This div should be hidden if javascript is disabled, but visible if javascript is on.</div>
    <noscript> --> </noscript>
    I thought that was "the" solution, but I've come across situations where it doesn't seem to work. In Chrome, for example, the comment tag actually comments out the closing noscript tag, making the div inside always hidden.

    Any solutions?

    In this particular example, the div is an overlay that hides the entire page and then fades out - basically a flash-style intro.

    My alternative is to have the div hidden when the page loads and show it via javascipt, but I don't want to risk seeing the content that's supposed to be hidden while waiting for the javascript to run on an older machine.

    Thanks, everyone.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,926
    Thanks
    43
    Thanked 3,192 Times in 3,155 Posts
    Blog Entries
    12

    Default

    What I do is use style. Say your div has an id - "overlay":

    Code:
    <style type="text/css">
    #overlay {
    	display: none;
    }
    </style>
    Then one of the first things in your script could be:

    Code:
    document.write('<style type="text/css">#overlay {display: block;}<\/style>');
    As long as the script follows the style and both are in the head, it will produce valid code. If javascript is enabled, the scripted style will override the hard coded one and the overlay will be seen. If javascript is unavailable, the hard coded one is the only one the browser will see, so the overlay will not be shown.

    Many people prefer to use the onload or document ready event to reveal javascript only elements like this. However, that often takes too long. Doing it this way is just like having it hard coded, no waiting for the page to load.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. The Following User Says Thank You to jscheuer1 For This Useful Post:

    traq (06-17-2010)

  4. #3
    Join Date
    Apr 2008
    Location
    So.Cal
    Posts
    3,643
    Thanks
    63
    Thanked 517 Times in 503 Posts
    Blog Entries
    5

    Default

    Never heard that before. Thanks!

Bookmarks

Posting Permissions

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