Hướng dẫn html2canvas scrolly - cuộn html2canvas

Question

Tôi đang sử dụng thư viện HTML2Canvas, sử dụng mã sau:

Nội dung chính Show

· 50 bình luận · Đã sửa bởi #2625
Specifications:

html2canvas(document.body, {
   onrendered: function(canvas) {
      document.body.appendChild(canvas);
   }
});

Khi

var scrollPos;
document.querySelector("screenshotButton").addEventListener("click",function() {
    scrollPos = document.body.scrollTop;
    html2canvas(document.body, {
       onrendered: function(canvas) {
          document.body.appendChild(canvas);
          window.scrollTo(0,scrollPos);
       }
    });
 });

9 được bắn, trang được tự động cuộn lên trên cùng. Có cách nào chúng ta có thể duy trì vị trí cuộn của mình và không được tự động lên đầu trang không?

Mattytommo

55K15 Huy hiệu vàng126 Huy hiệu bạc147 Huy hiệu đồng15 gold badges126 silver badges147 bronze badges

Đã hỏi ngày 21 tháng 9 năm 2013 lúc 17:31Sep 21, 2013 at 17:31

1

Tôi đã xem xét html2canvas.js và thấy dòng sau:

_html2canvas.Parse = function (images, options) {
    window.scroll(0,0);

Sau khi bình luận

html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })

0 ra, nó hoạt động tốt cho tôi trong bài kiểm tra địa phương của tôi. Có vẻ như hành vi đó được dự định bởi tác giả.

Tất nhiên bạn cũng có thể lưu vị trí cuộn hiện tại của mình vào một biến khi bắn mã. Cách bạn có thể làm điều đó tùy thuộc vào cách bạn thực hiện HTML2Canvas. Nếu đó là một nút như trên trang demo, bạn sẽ thêm trình nghe sự kiện vào nút đó:

var scrollPos;
document.querySelector("screenshotButton").addEventListener("click",function() {
    scrollPos = document.body.scrollTop;
    html2canvas(document.body, {
       onrendered: function(canvas) {
          document.body.appendChild(canvas);
          window.scrollTo(0,scrollPos);
       }
    });
 });

Đã trả lời ngày 29 tháng 7 năm 2014 lúc 21:28Jul 29, 2014 at 21:28

Hướng dẫn html2canvas scrolly - cuộn html2canvas

SVSchmidtsvschmidtSVSchmidt

5.9642 Huy hiệu vàng23 Huy hiệu bạc35 Huy hiệu Đồng2 gold badges23 silver badges35 bronze badges

3

Bạn sẽ có thể điều chỉnh vị trí scrolly, liên quan đến pageoffset hiện tại, hãy thử điều này

html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })

Đã trả lời ngày 29 tháng 10 năm 2019 lúc 0:46Oct 29, 2019 at 0:46

Riegersnriegersnriegersn

2.7893 huy hiệu vàng17 Huy hiệu bạc18 Huy hiệu đồng3 gold badges17 silver badges18 bronze badges

Một giải pháp khác cho iOS Safari Blank trên cuộn ...

Giải pháp này hoạt động

{
    scrollX: 0,
    scrollY: -window.scrollY
}

7 Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Você pode adicionar os seguintes estilos à caixa Vị trí: Đã sửa; Trái: 0; Top: 0; e

window.scrollto (0, 0); đã làm cho tôi.

Vấn đề mới

Có một câu hỏi về dự án này? Đăng ký một tài khoản GitHub miễn phí để mở một vấn đề và liên hệ với người bảo trì và cộng đồng của nó.

Bằng cách nhấp vào Đăng ký đăng ký cho GitHub, bạn đồng ý với Điều khoản dịch vụ và tuyên bố quyền riêng tư của chúng tôi. Chúng tôi thỉnh thoảng gửi cho bạn các email liên quan đến tài khoản.

Đã có trên Github? đăng nhập vào tài khoản của bạn · Fixed by #2625

Đóng

Woteska đã mở vấn đề này
Ngày 10 tháng 6 năm 2019

· 50 bình luận · Đã sửa bởi #2625

Bình luận
If I scroll to the top of the page (where the element starts), it works perfectly.
Wrong: https://ibb.co/8Y9SnTV (scrolling to the bottom of the element)
Good: https://ibb.co/7z1903r (scrolling to the top of the element)

      window.scrollTo(0, 0); // <-- this fixes the issue
      html2canvas(document.getElementById('drag-container-outer')).then((canvas) => {
        var a = document.createElement('a');
        a.href = canvas.toDataURL('image/jpeg');
        a.download = 'somefile.jpg';
        a.click();
      });

Bạn đang sử dụng phiên bản mới nhất
Works perfectly, there is no need to scroll.

Specifications:

Bạn đang thử nghiệm bằng cách sử dụng phiên bản HTML2Canvas không được xem xét và đã kiểm tra bất kỳ vấn đề tiềm ẩn nào được báo cáo trong bảng điều khiển
Báo cáo lỗi:
Trong 1.0.0-rc.3 nếu tôi cuộn lên đầu trang (nơi phần tử bắt đầu), nó hoạt động hoàn hảo. Sai: https://ibb.co/8y9sntv (cuộn xuống dưới cùng của phần tử) Tốt: https://ibb.co/7Z1903R (cuộn lên đầu phần tử)

Trong 1.0.0-rc.1 hoạt động hoàn hảo, không cần phải cuộn.

Phiên bản html2canvas được kiểm tra với: --- sai: v1.0.0-rc.3 | Tốt: 1.0.0-RC.1

Trình duyệt & Phiên bản: Chrome 75.0.3770.80

Hệ điều hành: Windows

1014156094, Tuffyliu, Yaxinr, Rockprince, Gerkindev, Gerardofurtado, Wzfjesun, WLJ231210, Spencerwahl

1 bình luận tương tự

{
    scrollX: 0,
    scrollY: -window.scrollY
}

Vì đây là một hack, nó sẽ thực sự tuyệt vời khi có vấn đề này được khắc phục! Chúc mừng 🍻

Tôi cũng, khi tôi cuộn trang, khung vẽ sẽ trống, nhưng khi tôi không cuộn, khung vẽ là ổn, thực sự muốn biết tại sao?

Miễn là trang cuộn, một khoảng trống xuất hiện phía trên ảnh chụp màn hình và cuộn càng dài, càng trống

1014156094, wb121017405, gerardofurtado, guidovv, smondragon-intera, zhouweicsu, kayo594 và 2 phản ứng khác với hooray biểu tượng cảm xúc và Samedro phản ứng với trái tim Emojiiamdiogo, Leonardossev, Volcanioo, S-Fahmy, Sheppardx và Samedro đã phản ứng với biểu tượng cảm xúc tên lửa.

Tôi đã phải đối mặt với cùng một vấn đề, nhưng cài đặt

html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })

1 không sửa nó. Cuối cùng tôi đã sửa nó bằng cách đảo ngược cuộn dọc bằng

html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })

2, như thế này:
I have also tried to use 1.0.0-rc.1.

Narviss, Amrsalama, Crashillo, Icidoug, Xhevatziberi, Sollrei, Glfei, Xuxiantao, Bozidars27, Yangdaniu, và 51 phản ứng với Thumbs Up Emojirenstillmann, Noctrlz10, ENZ , ivictbor, và 2 người khác phản ứng với cảm xúc cười Talkhabi, Olivercodez và 15 người khác phản ứng với trái tim Emojirenstillmann, Noctrlz1110, Giankotarola, Enzo-Billis, Benmliang, Kelscahill, Ffflora, Kipperlhp

tôi cũng vậy. Tôi có hộp thoại, vị trí hộp thoại được cố định; cơ thể quá chiều cao. Sử dụng 1.0.0-rc.1, trong Chrome là tốt. Trong iOS.use uiwebview, nó xấu. hộp thoại máy phát điện IMG là trong suốt

@jtremoulet

Xin chào,

Tôi đang phải đối mặt với cùng một vấn đề. Tôi đã cố gắng đặt một cách rõ ràng thành 0, thành (-window.scrolly), thành một giá trị cố định. Tôi cũng đã cố gắng sử dụng 1.0.0-rc.1.

@jtremoulet
Xin chào,
Có thể, giống như một số khác ở đây bạn đã thử cài đặt nó bằng tiền tố phiên bản Caret ("^")? RC1 không có vấn đề được đề cập trong báo cáo lỗi này.

Cảm ơn bạn, đó là vấn đề của tôi

Tôi đã phải đối mặt với cùng một vấn đề, nhưng cài đặt
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
1 không sửa nó. Cuối cùng tôi đã sửa nó bằng cách đảo ngược cuộn dọc bằng
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
2, như thế này:
{
    scrollX: 0,
    scrollY: -window.scrollY
}
Vì đây là một hack, nó sẽ thực sự tuyệt vời khi có vấn đề này được khắc phục! Chúc mừng 🍻

Nếu bạn muốn hỗ trợ IE11, chỉ cần sử dụng

html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })

5

Ornic, Gerardofurtado, Leasontou, Tiamins, Anilios, Renstillmann, Sergeiminaev, Lzhoucs, Deizepi, Sun79, và Amirsavand đã phản ứng Với trái tim biểu tượng cảm xúc và Amirsavand đã phản ứng với biểu tượng cảm xúc tên lửa

Này các bạn, tôi đang gặp vấn đề tương tự trong

html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })

6, có đề xuất nào không?

Tôi đã phải đối mặt với cùng một vấn đề, nhưng cài đặt
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
1 không sửa nó. Cuối cùng tôi đã sửa nó bằng cách đảo ngược cuộn dọc bằng
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
2, như thế này:
{
    scrollX: 0,
    scrollY: -window.scrollY
}
Vì đây là một hack, nó sẽ thực sự tuyệt vời khi có vấn đề này được khắc phục! Chúc mừng 🍻

Nếu bạn muốn hỗ trợ IE11, chỉ cần sử dụng

html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })

5

Ornic, Gerardofurtado, Leasontou, Tiamins, Anilios, Renstillmann, Sergeiminaev, Lzhoucs, Deizepi, Sun79, và Amirsavand đã phản ứng Với trái tim biểu tượng cảm xúc và Amirsavand đã phản ứng với biểu tượng cảm xúc tên lửa

Này các bạn, tôi đang gặp vấn đề tương tự trong

html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })

6, có đề xuất nào không?

Này các bạn, tôi đang gặp vấn đề tương tự trong
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
6, có đề xuất nào không?

Vì đây là một hack, nó sẽ thực sự tuyệt vời khi có vấn đề này được khắc phục! Chúc mừng

Giải pháp này đã giải quyết vấn đề của tôi

Không ai trong số này làm việc cho tôi, có giải pháp khả thi nào khác không?
Điều duy nhất làm việc cho tôi là hạ cấp xuống 1.0.0-alpha.12.

Tôi đã trải qua một vài vấn đề và hạ cấp xuống 1.0.0-alpha.12 cũng đã thực hiện thủ thuật cho tôi, cảm ơn!

Này các bạn, tôi đang gặp vấn đề tương tự trong
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
6, có đề xuất nào không?
Vì đây là một hack, nó sẽ thực sự tuyệt vời khi có vấn đề này được khắc phục! Chúc mừng

Giải pháp này đã giải quyết vấn đề của tôi

Không ai trong số này làm việc cho tôi, có giải pháp khả thi nào khác không?
You can add the following styles to the box：

      window.scrollTo(0, 0); // <-- this fixes the issue
      html2canvas(document.getElementById('drag-container-outer')).then((canvas) => {
        var a = document.createElement('a');
        a.href = canvas.toDataURL('image/jpeg');
        a.download = 'somefile.jpg';
        a.click();
      });

0
and then，html2Canvas configuration：

      window.scrollTo(0, 0); // <-- this fixes the issue
      html2canvas(document.getElementById('drag-container-outer')).then((canvas) => {
        var a = document.createElement('a');
        a.href = canvas.toDataURL('image/jpeg');
        a.download = 'somefile.jpg';
        a.click();
      });

1
Here's how I solved the problem of the generated image being offset by scrolling.

Điều duy nhất làm việc cho tôi là hạ cấp xuống 1.0.0-alpha.12.

Tôi đã trải qua một vài vấn đề và hạ cấp xuống 1.0.0-alpha.12 cũng đã thực hiện thủ thuật cho tôi, cảm ơn!

Hai cách làm việc cho tôi:
worked for me.
you can of course store the y offset and then immediately after html2canvas do:
window.scrollTo(0, scrollamount);

html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })

9 Trước khi bạn làm html2canvas.

Không ai trong số này làm việc cho tôi, có giải pháp khả thi nào khác không?
You can add the following styles to the box：

      window.scrollTo(0, 0); // <-- this fixes the issue
      html2canvas(document.getElementById('drag-container-outer')).then((canvas) => {
        var a = document.createElement('a');
        a.href = canvas.toDataURL('image/jpeg');
        a.download = 'somefile.jpg';
        a.click();
      });

0
and then，html2Canvas configuration：

      window.scrollTo(0, 0); // <-- this fixes the issue
      html2canvas(document.getElementById('drag-container-outer')).then((canvas) => {
        var a = document.createElement('a');
        a.href = canvas.toDataURL('image/jpeg');
        a.download = 'somefile.jpg';
        a.click();
      });

1
Here's how I solved the problem of the generated image being offset by scrolling.

Điều duy nhất làm việc cho tôi là hạ cấp xuống 1.0.0-alpha.12.

Tôi đã trải qua một vài vấn đề và hạ cấp xuống 1.0.0-alpha.12 cũng đã thực hiện thủ thuật cho tôi, cảm ơn!
I have tried

      window.scrollTo(0, 0); // <-- this fixes the issue
      html2canvas(document.getElementById('drag-container-outer')).then((canvas) => {
        var a = document.createElement('a');
        a.href = canvas.toDataURL('image/jpeg');
        a.download = 'somefile.jpg';
        a.click();
      });

4, downgrading to

      window.scrollTo(0, 0); // <-- this fixes the issue
      html2canvas(document.getElementById('drag-container-outer')).then((canvas) => {
        var a = document.createElement('a');
        a.href = canvas.toDataURL('image/jpeg');
        a.download = 'somefile.jpg';
        a.click();
      });

5 but it didn't help. Does anybody have any ideas about how to make html2canvas work with horizontal scrolling?

Hai cách làm việc cho tôi:

html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })

9 Trước khi bạn làm html2canvas.

hạ cấp xuống 1.0.0-alpha.12
Điều duy nhất làm việc cho tôi là hạ cấp xuống 1.0.0-alpha.12.

Tôi đã trải qua một vài vấn đề và hạ cấp xuống 1.0.0-alpha.12 cũng đã thực hiện thủ thuật cho tôi, cảm ơn!

Hai cách làm việc cho tôi:
this works everywhere except for iOS!

Tôi đã phải đối mặt với cùng một vấn đề, nhưng cài đặt
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
1 không sửa nó. Cuối cùng tôi đã sửa nó bằng cách đảo ngược cuộn dọc bằng
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
2, như thế này:
{
    scrollX: 0,
    scrollY: -window.scrollY
}
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
9 Trước khi bạn làm html2canvas.

hạ cấp xuống 1.0.0-alpha.12

Đối với tôi, không có tác phẩm nào ở trên trên iOS ngoại trừ
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
9, đây là một trải nghiệm kỳ lạ và chắc chắn trông giống như một vụ hack! Có ai ở đây có cùng một vấn đề với iOS không?
      window.scrollTo(0, 0); // <-- this fixes the issue
      html2canvas(document.getElementById('drag-container-outer')).then((canvas) => {
        var a = document.createElement('a');
        a.href = canvas.toDataURL('image/jpeg');
        a.download = 'somefile.jpg';
        a.click();
      });
7 Điều này hoạt động ở mọi nơi ngoại trừ iOS!
this works everywhere except for iOS!

Bất kỳ giải pháp mới nhất cho Safari? Cần giúp đỡ

Tôi đã giải quyết tất cả các vấn đề có thể xảy ra như sau ..

html2canvas(element , {
        scrollX: -window.scrollX,
        scrollY: -window.scrollY,
        windowWidth: document.documentElement.offsetWidth,
        windowHeight: document.documentElement.offsetHeight
})

Tôi đã giải quyết tất cả các vấn đề có thể xảy ra như sau ..

html2canvas(element , {
        scrollX: -window.scrollX,
        scrollY: -window.scrollY,
        windowWidth: document.documentElement.offsetWidth,
        windowHeight: document.documentElement.offsetHeight
})

Cảm ơn nhưng nó không khắc phục được vấn đề với iOS Thật không may, bạn vẫn phải cuộn lên đầu trang, chụp màn hình và sau đó cuộn lại!

Tôi đã giải quyết tất cả các vấn đề có thể xảy ra như sau ..
html2canvas(element , {
        scrollX: -window.scrollX,
        scrollY: -window.scrollY,
        windowWidth: document.documentElement.offsetWidth,
        windowHeight: document.documentElement.offsetHeight
})
Cảm ơn nhưng nó không khắc phục được vấn đề với iOS Thật không may, bạn vẫn phải cuộn lên đầu trang, chụp màn hình và sau đó cuộn lại!

Trong trường hợp của tôi, nó xảy ra trong một phương thức bật lên trên trình duyệt Safari.

Div đầy đủ có thể được hiển thị (trong phương thức) trên Chrome và Firefox. Trên Safari, khi bạn cuộn xuống phương thức, phần dưới cùng của phần tử bị bắt sẽ bị cắt.

hạ cấp xuống 1.0.0-alpha.12

Tùy chọn tùy chỉnh

{
    scrollX: 0,
    scrollY: -window.scrollY
}

2 như dưới đây:

_html2canvas.Parse = function (images, options) {
    window.scroll(0,0);

2

#kết xuất-tôi là đoạn HTML được hiển thị.

_html2canvas.Parse = function (images, options) {
    window.scroll(0,0);

3

Trong trường hợp của tôi, tôi đã thử mọi thứ ở trên, nhưng nó không hoạt động tốt trên thiết bị di động và iOS. Vì vậy, thay vì thêm các tùy chọn cuộn, tôi đã chọn cách buộc màn hình lên bằng Scrollto. Hàm SetTimer và chức năng gọi lại cho phép màn hình được nâng lên trước và được ghi lại sau. Bạn có thể dễ dàng kiểm tra thứ tự thực thi mã thông qua Console.log.

Với phương pháp này, tôi đã kiểm tra rằng việc chụp hình ảnh hoạt động tốt như mong muốn trong môi trường di động và iOS.

Bất kỳ cập nhật về điều này? Gần nhất tôi có được một bản sửa lỗi là Window.Scrollto (0, 0) hoạt động gần như ở mọi nơi ngoại trừ điện thoại di động khi thanh địa chỉ được mở rộng. Ví dụ: nếu bạn cuộn xuống thanh địa chỉ sụp đổ và gọi Window.Scrollto (0, 0) đặt lên trên cùng như tôi hy vọng và không bị cắt. Khi trang đầu tiên tải và thanh địa chỉ mở, tôi sẽ nhận được một khoảng cách màu trắng dọc theo đáy của kết xuất.

Tôi đã tìm thấy giải pháp này để hoạt động tốt:

#1981 (bình luận)

html2canvas(element , {
        scrollX: -window.scrollX,
        scrollY: -window.scrollY,
        windowWidth: document.documentElement.offsetWidth,
        windowHeight: document.documentElement.offsetHeight
})

Tôi đã tìm thấy giải pháp này để hoạt động tốt:

#1981 (bình luận)

html2canvas(element , {
        scrollX: -window.scrollX,
        scrollY: -window.scrollY,
        windowWidth: document.documentElement.offsetWidth,
        windowHeight: document.documentElement.offsetHeight
})

Tôi thấy rằng ScrollX/Y không phản hồi trừ khi phần tử được cố định như đã đề cập trong các tài liệu tham khảo.

Tôi đã tìm thấy một giải pháp nhưng tôi không hài lòng với việc nó tròn như thế nào

_html2canvas.Parse = function (images, options) {
    window.scroll(0,0);

6

Tôi đã phải đối mặt với cùng một vấn đề, nhưng cài đặt
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
1 không sửa nó. Cuối cùng tôi đã sửa nó bằng cách đảo ngược cuộn dọc bằng
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
2, như thế này:
{
    scrollX: 0,
    scrollY: -window.scrollY
}
Vì đây là một hack, nó sẽ thực sự tuyệt vời khi có vấn đề này được khắc phục! Chúc mừng 🍻

Ồ! Cảm ơn bạn rất nhiều, bạn đã cứu mạng tôi

Tôi đã tìm thấy giải pháp này để hoạt động tốt: #1981 (bình luận)
#1981 (comment)
html2canvas(element , {
        scrollX: -window.scrollX,
        scrollY: -window.scrollY,
        windowWidth: document.documentElement.offsetWidth,
        windowHeight: document.documentElement.offsetHeight
})
Tôi thấy rằng ScrollX/Y không phản hồi trừ khi phần tử được cố định như đã đề cập trong các tài liệu tham khảo.
Tôi đã tìm thấy một giải pháp nhưng tôi không hài lòng với việc nó tròn như thế nào
_html2canvas.Parse = function (images, options) {
    window.scroll(0,0);
6

Tôi đã phải đối mặt với cùng một vấn đề, nhưng cài đặt

html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })

1 không sửa nó. Cuối cùng tôi đã sửa nó bằng cách đảo ngược cuộn dọc bằng

html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })

2, như thế này:

Tôi đã phải đối mặt với cùng một vấn đề, nhưng cài đặt
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
1 không sửa nó. Cuối cùng tôi đã sửa nó bằng cách đảo ngược cuộn dọc bằng
html2canvas(document.body, { scrollY: (window.pageYOffset * -1) })
2, như thế này:
{
    scrollX: 0,
    scrollY: -window.scrollY
}
Vì đây là một hack, nó sẽ thực sự tuyệt vời khi có vấn đề này được khắc phục! Chúc mừng 🍻

Ồ! Cảm ơn bạn rất nhiều, bạn đã cứu mạng tôi

Tôi đã tìm thấy giải pháp này để hoạt động tốt: #1981 (bình luận)
my version: html2canvas: "1.0.0-rc.7"

var scrollPos;
document.querySelector("screenshotButton").addEventListener("click",function() {
    scrollPos = document.body.scrollTop;
    html2canvas(document.body, {
       onrendered: function(canvas) {
          document.body.appendChild(canvas);
          window.scrollTo(0,scrollPos);
       }
    });
 });

1

TKS giải pháp này đã giải quyết vấn đề của tôi

var scrollPos;
document.querySelector("screenshotButton").addEventListener("click",function() {
    scrollPos = document.body.scrollTop;
    html2canvas(document.body, {
       onrendered: function(canvas) {
          document.body.appendChild(canvas);
          window.scrollTo(0,scrollPos);
       }
    });
 });

2

Điều này hoạt động hoàn hảo!

Giải pháp của tôi: Phiên bản của tôi: HTML2Canvas: "1.0.0-rc.7"

var scrollPos;
document.querySelector("screenshotButton").addEventListener("click",function() {
    scrollPos = document.body.scrollTop;
    html2canvas(document.body, {
       onrendered: function(canvas) {
          document.body.appendChild(canvas);
          window.scrollTo(0,scrollPos);
       }
    });
 });

3

GetPoseition: Nhận phần tử vị trí liên quan đến root

Điều này hoạt động hoàn hảo trong dự án của tôi!

Giải pháp của tôi: Phiên bản của tôi: HTML2Canvas: "1.0.0-rc.7"

var scrollPos;
document.querySelector("screenshotButton").addEventListener("click",function() {
    scrollPos = document.body.scrollTop;
    html2canvas(document.body, {
       onrendered: function(canvas) {
          document.body.appendChild(canvas);
          window.scrollTo(0,scrollPos);
       }
    });
 });

4

GetPoseition: Nhận phần tử vị trí liên quan đến root

CSS:

var scrollPos;
document.querySelector("screenshotButton").addEventListener("click",function() {
    scrollPos = document.body.scrollTop;
    html2canvas(document.body, {
       onrendered: function(canvas) {
          document.body.appendChild(canvas);
          window.scrollTo(0,scrollPos);
       }
    });
 });

5

Điều này hoạt động hoàn hảo trong dự án của tôi!

var scrollPos;
document.querySelector("screenshotButton").addEventListener("click",function() {
    scrollPos = document.body.scrollTop;
    html2canvas(document.body, {
       onrendered: function(canvas) {
          document.body.appendChild(canvas);
          window.scrollTo(0,scrollPos);
       }
    });
 });

6

Phiên bản: 1.0.0-rc.7

Nó hoạt động!

CSS:

var scrollPos;
document.querySelector("screenshotButton").addEventListener("click",function() {
    scrollPos = document.body.scrollTop;
    html2canvas(document.body, {
       onrendered: function(canvas) {
          document.body.appendChild(canvas);
          window.scrollTo(0,scrollPos);
       }
    });
 });

7

Điều này hoạt động hoàn hảo trong dự án của tôi!

var scrollPos;
document.querySelector("screenshotButton").addEventListener("click",function() {
    scrollPos = document.body.scrollTop;
    html2canvas(document.body, {
       onrendered: function(canvas) {
          document.body.appendChild(canvas);
          window.scrollTo(0,scrollPos);
       }
    });
 });

8

Phiên bản: 1.0.0-rc.7

{
    scrollX: 0,
    scrollY: -window.scrollY
}

7

Nó hoạt động!
position: fixed; left: 0; top: 0;
e então，configuração html2Canvas：
{ scrollY: 0 }

Đợi một chút công việc cho tôi!
worked for me.

programming html Html2canvas dynamic content Html2canvas not working Html2canvas example Html2pdf scroll Html2canvas onrendered

Hướng dẫn html2canvas scrolly - cuộn html2canvas

Đóng

· 50 bình luận · Đã sửa bởi #2625

Specifications:

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội