[thelist] Disable CSS before calling window.print()

Bill Moseley moseley at hank.org
Thu Jun 5 08:07:00 CDT 2008


I have a page that has a number of style sheets.  I have common rules
in media="all" and screen positioning rules in media="screen".

I'm not much of a fan of "print" links on pages where all they do is
call window.print() as I think it's more consistent UI design to
simply use File->Print, but it's not always my decision.

So, I was requested to add a print link that not only calls
window.print() but first disables all media="screen" style sheets
so that the layout in the browser looks like what the printed page
will look like (kind of a Print Preview function but can't interact
with it).

This was my first pass, and works fine in Firefox but in IE
the layout does not change, just the print dialog shows.

    function print_preview() {
        for(var i=0; i < document.styleSheets.length;i++) {
            var sheet = document.styleSheets.item(i);

            if ( sheet.media.mediaText == 'screen' )
                sheet.disabled = true;
        }

        window.print();

        for(var i=0; i < document.styleSheets.length;i++) {
            var sheet = document.styleSheets.item(i);

            if ( sheet.media.mediaText == 'screen' )
                sheet.disabled = false;
        }

        return false;
    }

Suggestions for a better approach -- or reasons why it's not disabling
the styles in IE?


Thanks,



-- 
Bill Moseley
moseley at hank.org
Sent from my iMutt




More information about the thelist mailing list