Question

我正在使用html5和css3：

在网页中显示pdf

<embed class="pdf" src="/files/test.pdf" type="application/pdf">

实际文件根据网页上的选择和用户上传而有所不同，但考虑到上下文，我知道在大多数情况下，用户将必须旋转pdf才能理解它。这通常很容易通过右键单击并选择＆＃34;旋转＆＃34;手动完成。但是，既然我知道这是必要的，我想把它们呈现为旋转。我到目前为止找到的唯一方法是使用css transform，但这也会旋转菜单和滚动条，这是我不想要的。

有没有办法，使用css或javascript告诉浏览器将旋转应用于嵌入式pdf？我主要需要这个才能在Chrome上运行，因此浏览器特定的解决方案很好。

Answer 1

在Chrome中，您可以使用Ctrl +]顺时针旋转，Ctrl + [逆时针旋转

<强> EDITED

如果您需要使用脚本执行此操作，那么可能您可以按照此链接上的说明使用PDF.js：https://blog.oio.de/2014/04/11/integrating-pdf-js-pdf-viewer-web-application/并在本地托管您的查看器以避免跨域问题

然后，您可以轻松地将查看器嵌入到页面上的iframe中，并访问iframe的内容以旋转PDF。

代码如下：

var rotatedeg = 90;
var rotate_css = 
{
'-webkit-transform': 'rotate(' + rotatedeg + 'deg)',
'-moz-transform': 'rotate(' + rotatedeg + 'deg)',
'-ms-transform': 'rotate(' + rotatedeg + 'deg)',
'-o-transform': 'rotate(' + rotatedeg + 'deg)',
'transform': 'rotate(' + rotatedeg + 'deg)'
};
// my-frame is id of iframe
 $("#my-frame").contents().find("#viewer").css(rotate_css);

我已对此进行了测试，适用于所有当前版本的Firefox，Chrome，IE和Safari。希望这会有所帮助。

在html5中旋转嵌入的pdf

1 个答案: