skip to Main Content

I use html-to-image to get an image of a dom element which has to be rendered and visible (can’t hide it with display: none or something similar). I add it to document.body and remove it after the promise which results to the element flickering for a few milliseconds in the extension.

I am trying to find a way to "hide" it from the extension. Any idea?

2

Answers


  1. use visibility hidden.

    like this:

    visibility:hidden;

    source:
    -> display:none turns off the layout of the elements, so they are not rendered

    -> visibility:hidden hides the elements without changing their layouts

    ->opacity:0 causes the elements to be very transparent but users can still interact with them.

    Login or Signup to reply.
  2. to reduce flickering you can use CSS Animation Transition Component in the internet even free,

    or

    Instead of adding the element to the visible document body and then removing it,
    Try rendering it off-screen.
    This involves setting a negative value for the element’s left or top position property, effectively moving it outside of the visible area.

    or

    Instead of using the original element, create a clone of the element and work with the clone.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search