Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 1 of 1
  1. #1
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Thanked 626 Times in 605 Posts

    easy javascript-disabled preview

    graceful degradation is nice, but how do we make sure our pages work on all devices when javascript is disabled?

    you can turn JavaScript on and off in most browsers, but it's rarely simple to do so just for a quick test in the middle of your development work.

    using HTML5's new sandbag attribute for the iframe, we can view a site without javascript using an iframe.

    i boiled this down to a handy bookmarklet that can do this for the current site:

    <a href="javascript:location.href='http://danml.com/nojs/#'+encodeURIComponent(location.href);"
    EDIT: you can use this link to a page hosting the bookmarklet to make it easier to "install".
    if you've never used one, just go to the page linked above and drag the only link there to your bookmarks toolbar. installed. click while viewing any site to enter no-js mode...

    simple, can be used on mobile devices, and it respects your privacy.

    Note: a site can prevent this from working by sending a special HTTP header. This is not supposed to be used to view sites you are not building. If you want to make sure it works, don't send the "X-Frame-Options" header.

    Note2: yes, this does link to my site, but because it uses the hash, bookmarklets leave no referrer, the site being framed will not appear in my log. i have no idea what it's being used for, nor can i tell even if i wanted to, which i don't.

    feel free to download the simple html shell and serve it on your own to alleviate lingering fears.
    Last edited by rnd me; 03-30-2013 at 12:31 AM.
    Create, Share, and Debug HTML pages and snippets with a cool new web app I helped create: pagedemos.com

  2. Users who have thanked rnd me for this post:

    saqisgd (03-29-2013)


Posting Permissions

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