0

To be able to download the content from my screen using browser printing

asked 2020-07-03 14:32:45 +0800

softteam gravatar image softteam
130 1 8

I have a screen where we visualize a set of images. I need to be able to download all those images in an easy way, and I had a hard time using the printing option provided by the browser, but when I do Ctrl + P the images are not displayed. Checking on other websites I have the possibility to view all the images before downloading.

Is there any zk property that allows me to print everything that is seen on the screen? Thank you

image description image description

delete flag offensive retag edit

4 Answers

Sort by ยป oldest newest most voted
0

answered 2020-07-03 15:21:43 +0800

cor3000 gravatar image cor3000
6280 2 7

There are a few things I could imagine to cause this (print styles, using images as backgrounds instead of image tags ...). There definitely isn't a switch in ZK to enable/disable image printing.

So I tried what you describe, and for me the images are "just" printable as anything else.

Here what I did ... https://zkfiddle.org/sample/31e5u9t/1-printable-images

and a direct link without ZKFiddle around it https://zkfiddle.org/direct/31e5u9t/1/v9.0.1.2-printable-images?run=3bucuak

... here what I see after pressing Ctrl-P.

image description

Does this work on your side? Can you provide your failing scenario as a zkfiddle?

Maybe you already see the difference.

link publish delete flag offensive edit
0

answered 2020-07-03 15:33:10 +0800

cor3000 gravatar image cor3000
6280 2 7

Here a case using a css "background-image" https://zkfiddle.org/sample/31e5u9t/2-printable-images

You can print it by enabling "Background-graphics" in the print dialog.

before image description after image description

link publish delete flag offensive edit
0

answered 2020-07-13 15:29:39 +0800

softteam gravatar image softteam
130 1 8

updated 2020-07-13 15:29:58 +0800

I have made an example in zkfiddle to reflect the problem I have. https://zkfiddle.org/sample/3caf2bm/2-Save-image-page-with-print-browser](https://zkfiddle.org/sample/3caf2bm/2-Save-image-page-with-print-browser)

I can have 100, 200, or more images on screen and doing ctrl + P does not display all images. I have verified on other websites with images that when I ctrl + P I can scroll and view all the images and when I save it in pdf all the images are saved. Is there any way I can get it using zk's Image component?

Thanks,

link publish delete flag offensive edit
0

answered 2020-07-13 17:39:40 +0800

MDuchemin gravatar image MDuchemin
2535 1 6
ZK Team

Hi There,

This is more a general page design than a ZK question, but I will try help :)

The main issue you encounter here is that you create cut off points in the page in two ways:

  1. you are setting a overflow: auto, with a limited height (100% of parent) on the inner div. The print function will not try to scroll down a scrollbar located inside of the page. If you are designing a page to be printed, your should avoid scrollbars in the page, and use the document scrollbar instead (which the print fonction will scroll)

  2. you are using a window with a defined height and width, which also makes it a bounded container, with a scrollbar inside (even if not visible). You should avoid it for the same reason if you expect the page to be printed.

Last advice would be, use the @media print css feature :) most website with internal scrollbars will actually this kind of @media query to format their content for print. This usually involve removing scrolling, flattening the design, removing floating windows, etc. See an example here (simplified the page, and added the @media print rules): zkfiddle example

link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow
1 follower

RSS

Stats

Asked: 2020-07-03 14:32:45 +0800

Seen: 11 times

Last updated: Jul 13 '20

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More