Prevent right-click save on html.Img

Dash Python
1

First off merry christmas everyone!

I’m curious on how i can disable right-click save on a html.Img component of Dash?

The Image is embedded inside the Navbar

def create_navbar():
    navbar = dbc.Navbar(
            dbc.Container(
                [
                    dbc.Row([
                        dbc.Col([
                            html.Img(src=LOGO, height="100px"),
                            dbc.NavbarBrand("Brandname", className="ms-2")
                        ],
                        width={"size":"auto"})
                    ],
                    align="center",
                    className="g-0"),
                   .
                   .
                   .
                   return navbar

I’ve tried numerous way but for some reason it doesn’t work.

Since the “oncontextmenu” or “contextmenu” seems to be removed i tried it prevent it via css

img {
  pointer-events: none !important;
}

Which doesn’t work even if i declare a seperate class and add the className to the html.Img.

If someone could hint me a trick on how to do it or what could be this issue here i would be very grateful! :slight_smile:

2

Hello @mvnchi,

You need to add an event listener to the image and then preventDefault for the context menu.
This needs to be done on the clientside.

1 Like