Ich versuche, bestimmte DIVs dynamisch zu verstecken, wenn ein Druck (oder eine Druckvorschau) vom Browser erfolgt.
Ich kann statisch leicht unterscheiden, indem ich zwei Stylesheets verwende, eines für Normal und eines für Printmedien:
Aber ich muss noch einen Schritt weiter gehen und einige Elemente dynamisch ausblenden, wenn das Druck-Stylesheet während eines Druckvorgangs nach bestimmten Kriterien aktiv wird
Eine einfache Lösung wäre die Handhabung eines DOM-Ereignisses für print / printview, dann könnte ich einfach jQuery verwenden, um die Anzeige zu ändern: Keine der Klassen, die ausgeblendet werden müssen, aber ich kann keine finden DOM Druckereignis !!
Wer weiß, was die Lösung ist?
Ich glaube nicht, dass Sie ein Druckereignis benötigen. Sie müssen nur Ihre @media print
-Stile basierend auf Ihren Javascript (?) Kriterien anpassen. Wenn der Benutzer versucht, die Seite zu drucken, wird der @media print
-Stil angewendet und Ihre Stile werden wirksam:
Wenn Sie serverseitige Kriterien verwenden, um zu bestimmen, welche Drucke gedruckt werden sollen, geben Sie einfach serverseitigen Code aus, um die Klassen nach Bedarf zu dekorieren. Vielleicht solltest du darüber nachdenken, eine vorhandene Klasse zu ändern, die sich bereits in @media print
befindet, oder das neue CSS mit etwas anderem als @media print
zu erstellen, was ich für schrecklich halte, aber in Opera 9.6 zu funktionieren scheint. Safari für Windows 3.1.2, IE 6 und Firefox 2.0.0.17 (Ich habe keine anderen Browser getestet).
Markieren Sie diese DIVs einfach mit einer Klasse, die auf dem Druck-Stylesheet versteckt ist:
HTML
%Vor%print.css
%Vor%Wenn Sie nicht im Voraus wissen, welche Elemente Sie ausblenden müssen, können Sie Javascript verwenden, um die Klasse für die angegebenen Objekte festzulegen:
JavaScript
%Vor%In IE gibt es ein Ereignis onbeforeprint . Es scheint nicht von anderen gängigen Browsern unterstützt zu werden. (Ich habe Firefox 3.0.3 und Safari 3.1.2 getestet.)