0

When an image on a web-page is right-clicked a menu appears which provides the ability to "Save Image As". Is it possible to get this functionality through jQuery or JavaScript by clicking on a button (div).

I've tried to get code from numerable sites without success.

The following is a simple test page where clicking on the red button would show the menu.

Thanks,

<!DOCTYPE HTML>
<html>
  <head>
    <title>Test</title>
    <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1.0"/>
    <script src='jquery-2.1.4.js'></script>
    <style>
        #divBtn{
            width: 100px;
            height: 50px;
            top: 0px;
            left: 0px;
            background-color: #ff0000;
            position: absolute;
        }
        #divImage {
            width: 864px;
            height: 541px;
            top: 50px;
            left: 0px;
            position: absolute;
        }
    </style>
  </head>
  <body>
    <a href="Imager.jpg" download="ImageCopy.jpg"><div id="divBtn"></div>Click</div></a>
    <div id="divImage">
        <img src='Imager.jpg'></img>
    </div>

    <script>
        $(document).ready(function(){

            //Code to show menu when divBtn is clicked.

        });
    </script>

  </body>
</html>
TedN
  • 33
  • 6

1 Answers1

0

This is not possible to do. You can however create your own "menu" through the use of and trigger it with the right click event. You cannot access the browser's right click menu.

You can trigger download of an image using HTML5 download attribute. More info here: Simulate Save Image As

Canolyb1
  • 672
  • 5
  • 17
  • I've placed the button div inside an anchor tag and now get the download menu when it is clicked. Is there a way in jquery to operate a click on the anchor tag so the download menu appears. I ask this as I would like to use a variable for the image name. – TedN May 26 '17 at 21:29