<img src="img.pdf"> doesn't work due to it being a pdf. I don't like the embed and iframe environments either, since they add the pdf viewer options, the scroll etc. I tried converting the pdf to an image with the convert and pdftoppm commands on Linux, but these result in the image having extra white space on top and bottom to fit A4 format, and/or makes the background black (instead of white or transparent).
Any ideas?
"Img" is in effect an iFrame of an embedded binary object, but it is borderless since it is statically scaled to one non zoomable size. Note the img above this text is framed as https://i.stack.imgur.com/xpw2l.png
Yes there are ways to make it more dynamic but vanilla binary PNG/JPG/ETC are imbedded, and part of the binary HTML viewer renders those fixed areas. You can switch them off if you wish, or they don't display if badly served.
So why is PDF not simply treated like an image as per your question?
The answer is simple they are a different type of binary that requires a different html viewing binary extension. One frequent complaint is why use "menus and scrollbars if not needed for a simple file?"
The answer to that is those controls need to be in the extension, for zoom pan etc. So how comes the FireFox viewer above has none?, that's because as a user I switched them OFF.
Related
I'm using html2canvas to allow users to download a div element to their local files as an image.
What they are saving is an image with dynamic text on top of it that changes based on their user input (this whole div becomes one image).
The saving part works, and users can save the div as an image to their local files. However, the dynamic text moves downward and the image looks off because of it.
I tried to make changes to html2canvas code based on someone's solution on github, but it didn't work and I reset this code to the original.
Is this a common problem that others have faced? How do I solve this problem without hard-coding the solution (moving the dynamic text up on the web application so when it moves downward when saving, it looks how it's supposed to look)?
Thanks!
I'm using the fauture save as pdf in printing dialog of Google Chrome to print this website. The website has two display options: 1. non-expand and 2. expand. In the 2nd option, the solution to exercise will be shown. The 1st option is by default when we visit the website, whereas to active the 2nd option, we need to click on the plus symbol on the top right corner:
I could not understand why the font size of PDF document is significantly smaller in the 2nd option.
1st option:
2nd option:
I save both of them as complete webpage and they have the same files, except for the .html file.
Could you please elaborate on how this problem arises and how to adjust the html file of the 2nd option to have the bigger font size as the 1st option?
I've figured out: this is because the font size will be reduced so that long equation can fit in.
that I would like to say, there is a good (or maybe not) bootstrap framework that can generate buttons with simple code.
I really like how these buttons look, and I want to use them in another software, but for this I need them in PNG format.
Why is not satisfied with the option "manually" - the buttons need a lot and not always needed, but when needed - they need fast, do not really want to spend a lot of time creating buttons ...
Current process:
Open page (for example https://www.tutorialrepublic.com/twitter-bootstrap-button-generator.hhp) to set the necessary parameters (button name, size, type, color, icon ...)
Copy the whole screen to the buffer
Insert a screenshot from the buffer into an image editor
Make necessary cropping of this picture, leave only the image of the button itself
Save the result in png format
Use the image in your application.
That I would like to receive:
Open (no difference - internet page, any software, etc...)
Specify the required parameters (button text, size, color, icon)
Press the button - save to PNG, without loss of quality.
Use the image in your application
Maybe someone already solved a similar problem and translated it into a semi-automatic mode, share the implementation.
I use Win10 at workstation
The easiest way would be to manually crop them by Snipping Tool. This works great if you have just a few buttons.
But if you want to take them automatically, I think you can use an python/opencv script to idendify buttons, crop and save them.
Ok, solution found - ShareX (https://getsharex.com/) software with 1 hotkey (ctrl + printscreen) - open crop dialog with zoom, after crop - makes the png-file automatic
I want to embed a PDF in chrome such that that the document fills the available horizontal space of the plugin. (i.e. Minimal gray plugin background at the sides of the document). Is there a way to pass a parameter when I embed the PDF that can specify the zoom level I want the document to open at?
Couldn't find anything recent on this topic. I found this but it's a couple years old and Google changed their PDF viewer recently.
Now it is possible.
You can provide plugin options via url.
To set document zoom to fit window width you need:
http://example.com/sample.pdf#view=fith
where fith - stands for fit horizontally
(I'm new to this)
I want to create a html5 page/application with text boxes to be filled out.
My objective is that once the user has completed filling out the empty fields they can hit one button on the webpage to save the content (including all pictures, texts, and the fields they completed) all as either an image or even pdf for printing later.
Also note I'm doing this for mobile platforms, so I want the user to be able to store on their device after editing from their device. So options such html to pdf converter sites aren't usable.
Anyway this possible? Thanks.