mi3dot.org :: View topic - swich img u print CSS-u

Forum FAQ

Memberlist

Forum ignore list

Profile

swich img u print CSS-u

This forum is locked: you cannot post, reply to, or edit topics.

This topic is locked: you cannot edit posts or make replies.

mi3dot.org Forum Index -> Client-side

View previous topic :: View next topic

Author

Message

fanatic

Joined: 02 Nov 2004
Posts: 81
Location: vienna

Posted: 23.04.2007 15:40 Post subject: swich img u print CSS-u

Tko nema u glavi - ima u nogama...nisam razmisljao o ovom problemu kada je bilo vrijeme, pa sada moram izvoditi egzibicije. Naime ovako: htio bih da se u print modu logo.jpg zamijeni nekom drugom slikom, recimo logo_print.jpg ali bez da diram kod (jer se isti vec nalazi u stotinama stranica koje nisu sve pod mojom kontrolom).

Code:

Ima li nacina da se to odradi u css filu? Ili eventualno JavaScriptom?

Thx.

abeja

Joined: 22 Sep 2003
Posts: 803
Location: Rijeka

Posted: 23.04.2007 15:46 Post subject: Re: swich img u print CSS-u

fanatic wrote:

Code:

Ima li nacina da se to odradi u css filu? Ili eventualno JavaScriptom?

Thx.

napravis drugi css za print i ako ti je fotka u pozadini samo promijenis fotku...a ako nije u pozadini onda neznam:)

fanatic

Joined: 02 Nov 2004
Posts: 81
Location: vienna

Posted: 23.04.2007 16:22 Post subject:

print.css naravno postoji, a logo, kao sto se iz koda vidi, nije u pozadini. doduse postoji background image za header, ali koliko ja znam print css principijelno ne printa background slike pa shodno tome i nema vajde od switch-a bgr image-a, to i jeste moj problem...

ja se nadam da postoji nacin da se preko css rule-a direktno pristupi property-iju img #logo i logo.jpg zamijeni sa logo_print.jpg, nesto slicno kao ispisu url-ova kod linkova:

Code:

a[href^="http://"]::after {
content: " [source: "attr(href)"]";
}

moguce je da sam naivan, ali gdje je problem tu mora biti i rjesenje...

tubak

Joined: 14 Mar 2005
Posts: 133
Location: Istra

Posted: 23.04.2007 21:24 Post subject:

Javascript + DOM to će ti sigurno riješiti problem (pretpostavljam da već imaš neki .js fajl linkan na sve stranice) Imaš na Googlu masu primjera.

ToDD

Joined: 05 May 2005
Posts: 83
Location: Zagreb

Posted: 30.04.2007 13:38 Post subject:

mozda nekako ovako #header img { display:none; } #header { background: slika; width: x; height:x.... } neznam jel ovo uopce ima smisla, ali pokušaj je

che.UP
mi3.crew

Joined: 07 Sep 2003
Posts: 2320
Location: zagreb

Posted: 30.04.2007 14:40 Post subject:

fanatic wrote:

u browseru se moze podesiti opcija "print background colors and images" pa mozes postaviti napomenu za printanje... tako je slozena napomena na tcomovim stranicama kod ispisa spajanja...

_________________
UP | TypeTester | Accommodations App
Meni u Firefox-u ne radi AJAX

fanatic

Joined: 02 Nov 2004
Posts: 81
Location: vienna

Posted: 01.05.2007 10:54 Post subject:

na zalost, moja ciljna publika se jedva zna sluziti kompjuterima, tako da se bojim da je prckanje po setup-u browsera nerealisticna varijanta. kako stvari stoje, najpouzdanija metoda je apdejtati header i rijesiti problem image replacement-om ili nekom slicnom metodom. JavaScript/DOM, ako se izuzme poznata problematika s iskljucivanjem, bi takodjer bila lijepo rjesenje, iako za sada imam samo nejasnu predstavu kako bih to izveo. Ako netko imam kakav hint bio bih mu jako zahvalan...

Mihael

Joined: 10 Mar 2006
Posts: 48
Location: Slovenija, Ljubljana

Posted: 16.07.2007 00:03 Post subject:

Tvoj problem se riješti ovako.... Pustiš taj div sa image kao što je... <div id="header"> <a href="index.html"><img src="/images/logo.jpg" id="logo" alt="" width="" height="" /></a> </div> i dodaš novi ( na svim stranicama...) <div id="header_print"> <a href="index.html"><img src="/images/logo_print.jpg" id="logo" alt="" width="" height="" /></a> </div> i dobiješ <div id="header"> <a href="index.html"><img src="/images/logo.jpg" id="logo" alt="" width="" height="" /></a> </div> <div id="header_print"> <a href="index.html"><img src="/images/logo_print.jpg" id="logo" alt="" width="" height="" /></a> </div> Slijedi to da moraš header_print sakriti na prikazu stranice ... pa u stylesheet dodaš: div.header_print { display:none; } Onda slijedi to da moraš pripremiti dodatan css style file kojeg poimenuješ npr. print_style.css... i uključiš ga u <head></head> ovako: <link type="text/css" rel="stylesheet" href="css/print_style.css" media="print" /> Hint: media="print" znači da če upravo taj css fajl biti upotrijebljen za printanje... Pomoču print_style.css zapravo moramo header sakriti i prikazati header_print pa mu dodamo kod: div.header { display:none; } That's it...

fanatic

Joined: 02 Nov 2004
Posts: 81
Location: vienna

Posted: 16.07.2007 09:30 Post subject:

je, to je jedno od standardnih rjesenja koje na zalost nije primijenjeno na samom pocetku, a sada mi se nesto ne da manuelno updejtati 3.000 stranica. i, ne, header nije included pa i to elegantno rjesenje nije primjenjvo. argo ostaje samo DOM i JavaScript...

Mihael

Joined: 10 Mar 2006
Posts: 48
Location: Slovenija, Ljubljana

Posted: 18.07.2007 23:49 Post subject:

možda ovako nešto: umijesto da imaš 2 print styla po svakog za jedan medij (print i screen) upotrijebiš samo jednog i definiraš ovako: neki_fajl.css ------------------------- @media screen { /* CSS KOD ZA MEDIA=SCREEN } @media print { /* CSS KOD ZA MEDIA=PRINT } ... + ovo : http://www.w3.org/TR/REC-CSS2/generate.html ali pitanje je kako je sa IE6,... nisam probavao. IE6 več polago ignoriramo...

Display posts from previous:

	mi3dot.org Forum Index -> Client-side	All times are GMT + 1 Hour
Page 1 of 1

You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum