use*_*793 8 css browser printing
我正试图在浏览器发生打印(或打印预览)时动态隐藏某些DIV.
通过使用两个样式表,我可以轻松地进行静态区分,一个用于普通,一个用于打印介质:
但是,当打印样式表在打印期间根据特定条件变为活动状态时,我需要更进一步并动态隐藏一些元素
一种轻松解决它的方法是处理用于处理print/printview的DOM事件,然后我可以使用jQuery来更改display:none,需要隐藏的类,但我找不到DOM打印事件!
谁知道解决方案是什么?
我认为你不需要打印活动.您需要做的就是@media print根据您的Javascript(?)标准调整样式.当用户尝试打印页面时,@media print样式将适用,您的样式将生效:
<html>
<head>
<style id="styles" type="text/css">
@media print { .noprint { display:none; } }
</style>
<script type="text/javascript">
var x = Math.random();
if (x > .5) {
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '@media print { .maybe_noprint { display:none; } }';
document.getElementsByTagName('head')[0].appendChild(style);
}
</script>
</head>
<body>
<div class="noprint">This will never print.</div>
<span class="maybe_noprint">This may print depending on the value of x.</span>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
如果您使用服务器端标准来确定打印的内容,那么只需要服务器端代码吐出@media print来根据需要装饰类.此外,您可能需要考虑修改已经在内部的现有类@media print,或者使用除innerHTML我之外的其他内容来构建新的CSS ,我承认这对我来说很糟糕,但似乎可以在Opera 9.6,Safari for Windows 3.1.2中使用,IE 6和Firefox 2.0.0.17(我没有测试任何其他浏览器).
| 归档时间: |
|
| 查看次数: |
2548 次 |
| 最近记录: |