当选择打印预览

我用rangeslider创建一个滑块组件如何触发JavaScript函数，它看起来像下面当选择打印预览

不过，我准备好打印，在打印预览时，滑杆有规模的同时，滑块按钮的位置值与html中的值保持一致（在html中，当窗口调整大小时，有一个js函数来重新计算小节的大小和滑块按钮的位置）。

滑块在打印预览：

所以我的问题是，如何调用函数重新计算滑块按钮现在的位置是在打印预览，像window.resize事件。

欣赏任何评论！

2015-09-02 Daniel

可以创建jsfi ddle http://jsfiddle.net来演示？ – guest271314

德看看[这篇文章]（http://tjvantoll.com/2012/06/15/detecting-print-requests-with-javascript/）。它显示了如何检测用户的打印请求的一些可能的方法。然而，不确定你是否能够改变文件的外观。试一试。没有什么可以输的，对吧？ – ROAL

检测与javascript打印请求您可以尝试：

var beforePrintFunc = function() { 
    ... 
} 
//for chrome 
window.matchMedia('print').addListener(function(mql) { 
    if (mql.matches) { 
     beforePrintFunc(); 
    } 
}); 

window.onbeforeprint = beforePrintFunc;

要打印预览事件后检测：

var afterPrintFunc = function() { 
    ... 
} 
//for chrome 
window.matchMedia('print').addListener(function(mql) { 
    if (!mql.matches) { 
     afterPrintFunc(); 
    } 
}); 
window.onafterprint = afterPrintFunc;

然而，也有可能是在所指出的@torazaburo一个更简单的方法下面的评论只要你只是做造型的变化：

@media print { 
    //your print specific styles go here 
}

来源

2015-09-02 06:25:32

而不是这样做，为什么不在你的CSS中添加一个'@ print'媒体查询？ –

@torazaburo这是一个好点。虽然OP的问题似乎是关于如何在打印预览之前触发一个JavaScript函数 –

当然，取决于你想要解释他的问题的狭窄程度。似乎有点清楚，他的最终目标是以特定尺寸打印滑块。在'beforePrint'上安装钩子是实现这一目标的一种特殊方式。媒体查询是另一个。钩子方法的问题在于，打印完成后，您可能需要恢复以前的大小 - 是否有一个“afterprint”事件？ –

当选择打印预览

回答

相关问题