We use cookies to ensure that we give you the best experience on our website. If you continue to use this site we will assume that you are happy with it.

Ok, I Agree

Take screenshot with HTML elements

Home › Forums › General Questions › Take screenshot with HTML elements

Tagged: 

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • 2023-10-07 at 11:55 am #67392
    kitt
    Customer

    Hi all,

    I’m wondering if it’s possible to take a screenshot of the viewport with all the visible HTML elements overlaying it, either via the take screenshot puzzle or some other means?

    Many thanks,
    Kitt

    2023-10-07 at 5:59 pm #67395
    kdv
    Participant

    Hardware methods like Print Screen on PC or Power + Volume down in Android.

    Or you can try this way

    Puzzles and JS. Fast and expensive.

    If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of meaning at all.

    2023-10-08 at 10:50 am #67399
    kitt
    Customer
    kdv wrote:

    Hardware methods like Print Screen on PC or Power + Volume down in Android.

    Or you can try this way

    Thanks, kdv. So, for clarity, I’d like it so that when a user clicks on a button a HTML elements pops-up with the user’s input and then saves a png locally to their computer.

    I’ve had a look at your second suggestion already – but I can’t figure out how/where to put the right code so that it happens with the button press – given that my code is split between all the standard Verge source files and my own HTML/CSS. I’ve tried linking the generated .js file to my HTML (which does work) and putting the code in the right section, but it doesn’t seem to handle the event listener correctly and gives me an error in the console. My js knowledge is not sufficient enough to know where I’m going wrong – any advice?

    2023-10-08 at 4:59 pm #67400
    kdv
    Participant
    kitt wrote:

    I’ve had a look at your second suggestion already

    Which one? Google suggests several variants. Try html2canvas. It works.

    Puzzles and JS. Fast and expensive.

    If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of meaning at all.

    2023-10-08 at 5:41 pm #67401
    mashud008
    Customer

    I think this puzzle structure for taking screenshots will help you.

    Attachments:
    You must be logged in to view attached files.
    2023-10-08 at 6:41 pm #67403
    kdv
    Participant
    mashud008 wrote:

    I think this puzzle structure

    The condition below won’t be met.

    kitt wrote:

    with all the visible HTML elements overlaying it

    Puzzles and JS. Fast and expensive.

    If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of meaning at all.

    2023-10-08 at 7:12 pm #67404
    kitt
    Customer
    kdv wrote:
    kitt wrote:

    I’ve had a look at your second suggestion already

    Which one? Google suggests several variants. Try html2canvas

    Yes, that’s the one I’ve already tried and can’t figure out how to get it right.

    kdv wrote:
    kitt wrote:

    with all the visible HTML elements overlaying it

    This condition won’t be met. You think wrong.

    So it’s not possible? I’m confused.

    2023-10-08 at 7:15 pm #67405
    kitt
    Customer
    mashud008 wrote:

    I think this puzzle structure for taking screenshots will help you.

    Thanks, but I have already tried this and it only renders the 3D viewport but none of the HTML elements around it.

    2023-10-08 at 7:18 pm #67406
    kdv
    Participant
    kitt wrote:

    So it’s not possible? I’m confused.

    With puzzles? Impossible. With html2canvas? Possible.

    Puzzles and JS. Fast and expensive.

    If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of meaning at all.

    2023-10-08 at 7:57 pm #67408
    kitt
    Customer
    kdv wrote:
    kitt wrote:

    So it’s not possible? I’m confused.

    With puzzles? Impossible. With html2canvas? Possible.

    Yes, I agree – but I can’t figure out how to make it work and I’m looking for some advice. Are you able to help at all?

    2023-10-08 at 8:08 pm #67409
    kdv
    Participant
    kitt wrote:

    but I can’t figure out how to make it work

    This page contains several working examples. Look through them carefully.

    kitt wrote:

    but it doesn’t seem to handle the event listener correctly and gives me an error in the console.

    You didn’t even show that error… Should we guess? You didn’t show your code… Should we remind every questioner to provide a little more information than just words?

    Working code example embedded in app_name.html

    Btw, it won’t take a screenshot of an app embedded in a frame.

    Puzzles and JS. Fast and expensive.

    If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of meaning at all.

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.