David, That is a great suggestion... re: if styles are disabled. Thanks!
...Rob -----Original Message----- From: David Hucklesby [mailto:[EMAIL PROTECTED] Sent: Thursday, February 07, 2008 1:52 PM To: Rob Emenecker; 'CSS Discussion' Subject: Re: [css-d] changing IMG SRC attribute value via CSS stylesheets? On Thu, 7 Feb 2008 10:58:23 -0500, Rob Emenecker wrote: > Hey all, > > I have a sight that I am working on that uses separate screen and > print CSS stylesheets. The screen version has a graphic that is white > with a drop shadow that appears over a background graphic. For the > print version, if user's have background colors/graphics turned off in > their browser, I would like an alternate graphic to appear -- white on white paper, despite the drop shadow, does not stand out. > > So, if in my XHTML, I have... > > <div id="head"> > <div id="logotype"> > <img src="/images/misc/logotype.png" alt="..." name="logotypeImg" width="370" > height="70" border="0" id="logotypeImg" /> </div> <div id="tagline"> > Where good food, family, and friends come together. </div> </div> > > Is there a way in CSS, to specifically alter the value of the "src" > attribute in the print.css stylesheet? > > I'm not opposed to having an alternate IMG in there and toggling the > DISPLAY values, provided that it won't break my layout. That is... > > <div id="head"> > <div id="logotype"> > <img src="/images/misc/logotype.png" alt="..." name="logotypeImg" width="370" > height="70" border="0" id="logotypeImg" /> </div> <div > id="logotypePrint"> <img src="/images/misc/logotypePrint.png" alt="..." name="logotypeImg" > width="370" height="70" border="0" id="logotypeImg" /> </div> <div > id="tagline"> Where good food, family, and friends come together. > </div> </div> > > ... and in the screen CSS... > > div#logotype { display: block; } > div#logotypePrint { display: none; } > > ... and then in the print CSS... > > div#logotype { display: none; } > div#logotypePrint { display: block;} > > Thoughts? Comments? Suggestions? Your approach should work okay. To prevent the logotypePrint image showing up when styles are not applied, you could use width="1" height="0" on that image, and put the dimensions in the print CSS. This will additionally allow you to use print values for those dimensions-- inches, for example. Cordially, David -- ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
