problem med display og js

document.getElementById("fane1").style.display = "none";
document.getElementById("fane2").style.display = "inline";

...dette kode står selvf. o en funktion som bliver kaldt når man trykker på menu-knapperne

Kan det mon være noget så basalt som en tuborgklamme for lidt...?

@media print{
  .noprint {display: none;}
}
@media screen{
  .printOnly {display: none;}
}

Eller skal du evt. benytter "block" i stedet for "inline"...?

<ole>

1) Hvad burde ske?
2) Hvad sker?
3) Hvad sker ikke?

/mvh
</bole>

softspot> tror det ikke - kan godt se der mangler lidt reklame i mit eksempel, men var noget jeg skrev eksklusivt her til spørgsmålet.

Siden kan se på:
www.gun.dk/np
www.gun.dk/stylesheet.css

Menuen virker fint - den viser 1 fane ad gangen ved at sætte display:none på de andre faner.
Når man printer skulle man så gerne få printet alle 4 faner.

Alle 4 faner er af klassen .alwaysPrint som er defineret som
@media print{
    .neverPrint {
        display: none;
    }
    .alwaysPrint {
        display: block;
    }
}
...men det bliver ignoreret! Hvorfor???
(menuen, som ikke skal printe, er af klassen neverPrint, og det virker)

whops - stylesheetet ligger selvfølgelig på www.gun.dk/np/stylesheet.css

Umiddelbart har jeg en teori om at det er fordi du ændrer på stylen display direkte i stedet for at holde fast i den class som elementerne har.

Jeg ved at olebole og en håndfuld andre brugere her på sitet vil slå mig oven i hovedet når jeg foreslår flg. løsning (men umiddelbart vil jeg mene det er den mest gennemskuelige):

Sørg for at skifte class på elementerne i stedet for at sætte display, for så kan du i dit stylesheet stadig definere at den valgte class skal vises på print- men ikke på screen-mediet. Noget i stil med:

@media print{
    .neverPrint {
        display: none;
    }
    .alwaysPrintShow {
        display: block;
    }
    .alwaysPrintHide {
        display: block;
    }
}
@media screen{
    .printOnly {
        display: none;
    }
    .alwaysPrintShow {
        display: block;
    }
    .alwaysPrintHide {
        display: none;
    }
}

og så noget i stil med denne JS:

document.getElementById("fane1").style.setAttribute("class", "alwaysPrintHide");
document.getElementById("fane2").style.setAttribute("class", "alwaysPrintShow");

...og for IE, skal det nok være noget med:
document.getElementById("fane1").style.setAttribute("className", "alwaysPrintHide");
document.getElementById("fane2").style.setAttribute("className", "alwaysPrintShow");


En fodnote til det sproglige på sitet (hvis det har nogen interesse):
"summery" betyder "sommerlig" på dansk, "summary" betyder "kortfattet" eller "resumé" på dansk ("resume" betyder så enten "genoptag" på dansk eller "CV"... på latin :)).

...og grunden til at olebole og andre "ekspert-bruger-spankere" her på sitet skulle slå mig oven i hovedet for at foreslå den løsning, er jo naturligvis, at det performer dårligt, at skifte et elements class ud i stedet for at skifte de enkelte styles direkte. Men som sagt, synes jeg den tekniske løsning virker lidt mere gennemskuelig, hvis man bare udskifter klassen (denne udtalelse medfører givetvis et par forslag på hvordan det kan gøres på den "rigtige"/mest optimale måde - man kan jo håbe :)).

Rettelse: "ekspert-bruger-spankere" skulle naturligvis være "eksperten-bruger-spankere" (selvom man ikke skal sætte sit lys under en skæppe, så hersker Janteloven jo trods alt her i landet ;-)).

Jeg kan ikke rigtigt få det til at virke.
Når jeg implementerer
document.getElementById("summary").style.setAttribute("class", "printOnly");
er der ingenting der virker længere ?

Skal det at du nu skriver "summary" så tolkes således at du har konsekvensrettet fra sommerlig til resumé...? Eller er det derfor ingenting fungerer nu...?

Jeg kan ikke helt gennemskue hvorfor du vil skifte klassen til printOnly. Min tanke var at du skiftede mellem alwaysPrintHide og alwaysPrintShow, når du skiftede fane. På den måde bliver du, på en let måde, i stand til at sætte de to tilstande i hvert deres medie (som jeg viste med eksemplet).

Eller er det mig der helt har misforstået hvad du vil?

Nix - det har du ikke.
Og tak for stavehjælp (det havde jeg aldrig selv fundet), men det er nu ikke det. Jeg rettede det selvfølgelig alle steder.

Jeg er ikke nogen haj til js, men det virker fint hvis jeg ændrer dit:
Document.getElementById("fane1").style.setAttribute("class", "alwaysPrintHide");
til:
Document.getElementById("fane1").setAttribute("class", "alwaysPrintHide");

Giver det ikke også god mening?
Mange tak for hjælpen. Du skal selvfølgelig have point så læg lige et svar.

(du kan se det i funktion på www.gun.dk/np www.gun.dk/np/stylesheet.css)

10/12-2006 11:46:25 >> Jo, du har da helt ret! Jeg undskylder mit manglende overblik, det er naturligvis ikke elementets style man skal sætte class på, men på selve elementet (godt set :)).

NB: Nu siger du godt nok at du har rettet stavefejlen alle steder, men den mangler at blive rettet det vigtigste sted, nemlig i menuen... :)

Velbekomme :)

øh, jep - der var selvfølgelig lige menu'en ;-)
Tak for hjælpen

Det var så lidt og tak for point :)

Pas på med 'class' ... sammen med set- og getAttribute virker det ikke i IE!

IE (i hvertfald til og med version 6.0 ... jeg er ikke sikker på 7.0) insisterer på, man skriver 'className' i stedet  :o|

olebole >> Jeg nævnte dette i mit indlæg fra 08/12-2006 16:37:19. Jeg har dog nok forsømt at lave et komplet eksempel på hvordan man checker hvilken browser koden kører i... :)