Để làm rõ, công cụ tay là một chức năng cho người dùng nhấp vào pdf và kéo xung quanh, được sử dụng để thay thế thanh cuộn điều hướng.Làm thế nào để thêm một công cụ tay (lấy trang và kéo) chức năng trên trình xem PDF của Chrome và Firefox?
Vấn đề là, theo mặc định trình xem pdf của Chrome và Firefox không có chức năng đó và tôi muốn cho phép người dùng kéo trang.
Cách giải quyết là sử dụng thư viện JavaScript (Grab to Pan https://github.com/Rob--W/grab-to-pan.js trong trường hợp của tôi) với đối tượng nhúng (trình xem PDF). Khi tôi tối đa kích thước của pdf và người dùng kéo đối tượng nhúng.
Vấn đề tôi có cuộc gặp gỡ là
Khi sử dụng Chrome/Firefox, nội dung PDF không phù hợp để trang nhưng tự động thay đổi kích thước theo mặc định ngay cả khi tôi đã thiết lập các tham số mở Adobe PDF, sử dụng iframe.
Mã JavaScript có vẻ xung đột với trình xem PDF của Firefox, mã hoạt động trơn tru trên Chrome nhưng không hoạt động trên Firefox.
Đây là mã nguồn, bạn có thể tải xuống thư viện từ liên kết đề cập ở trên và xem. Đừng quên đặt '1.pdf' cùng với tệp nguồn.
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>Grab-to-pan.js demo</title>
<link rel="stylesheet" href="grab-to-pan.css" type="text/css">
<style>
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
.scrollable {
overflow: auto;
width: 100%;
height: 100%;
background-color: #EEE;
}
#zoomPage {
overflow:visible;
width: 100%;
height: 150%;
}
</style>
</head>
<body>
<label><input type="checkbox" id="activate-g2p" checked> Activate Grab to Pan</label>
<div class="scrollable" id="scrollable-container">
<object id = 'zoomPage' type='application/pdf' data= '1.pdf#zoom=page-fit'><p>The PDF can not display</p></object>
</div>
<script src="grab-to-pan.js"></script>
<script>
document.getElementById('activate-g2p').onchange = function() {
if (this.checked) g2p.activate();
else g2p.deactivate();
};
var scrollableContainer = document.getElementById('scrollable-container');
var g2p = new GrabToPan({
element: scrollableContainer
});
g2p.activate();
</script>
</body>
</html>
Bạn có thể sử dụng các plugin kéo jquery khác để thay thế bản gốc. – user782104
bạn có thể tạo một câu đố cho mô hình làm việc hiện tại không. – MarmiK
bạn muốn nói rằng bạn muốn di chuyển đối tượng có chứa PDF hoặc một trang PDF? – MarmiK