CODEWITHSUNDEEP
javascriptjquerycss
user244394
user244394

Reputation: 13448

Print Css not loading

I am trying to load my print.css but it does not seem to be loading. it work Fine in FF and Safari but the problem is only in IE.

I have the regular external css for the page inbetween the head tags

And when the user click on the print link . it loads the print css .

<div class="linkPrint">
<a target="_blank" href="?format=print">Print</a>
</div>


var format = getUrlParam('format');
if (format == 'print') {
    $('head').append('<link href="/theme/print.css" rel="stylesheet" type="text/css" />');
}

But,in IE it load the standard css instead of the print.css.

How do can this be fixed for IE6?

Thanks

Upvotes: 1

Views: 1962

Answers (3)

eos87
eos87

Reputation: 9353

try with document.write,

document.write('<link href="/theme/print.css" rel="stylesheet" type="text/css" />');

Upvotes: 0

Mark Pope
Mark Pope

Reputation: 11264

Try removing the <link> to the other css file when you append the print.css

Upvotes: 0

Oded
Oded

Reputation: 499042

You can have the print CSS and your screen CSS both loaded at the same time on the page without them interfering with each other - you need to specify the media attribute on the link tag:

<link href="/theme/print.css" rel="stylesheet" type="text/css" media="print" />
<link href="/theme/screen.css" rel="stylesheet" type="text/css" media="screen" />

No need to go through the javascript trickery.

As for IE6 - it does support this, as can be seen on the comparison list on this page.

Upvotes: 7

Related Questions