Search code examples
javascriptphotophoto-gallery

prevent downloading photos in photobox


How to prevent apparent downloading photos when displaying them with photobox? I've disabled right-click on thumbnails shown on website but when I start slideshow with photobox I still can do it. Here's the part where I display photos on website:

<div class="gallery">
   <a href="<?=$path1; ?>">
   <img src="<?= $path1; ?>">
   </a>
   <div contentEditable="true"><?=pathinfo($path1, PATHINFO_FILENAME)?></div>
</div>

Here photobox displaying

<script type='text/javascript'>
        $(document).ready(function(){
             $('.gallery').photobox('a',{ time:0 });
    });
    </script>

And here right-click preventing

<script>
$("a").mousedown(function(e) {
return false;
});
</script>

Solution

  • Not sure how this prevents right clicking on the elements:

    <script>
        $("a").mousedown(function(e) {
            return false;
        });
    </script>
    

    Because I've tested that and the context menu still appears. Since you're also passing e to the function but not doing anything to it. But this one does:

    <script>
        $(document).ready(function(){
            $("a").mousedown(function(e) {
                document.addEventListener('contextmenu', e =>
                    e.preventDefault()
                );
            });
        });
    </script>
    

    Note the ready() event listener to wait until the DOM has loaded for it to affect all "a" elements. Another thing about this is that such rules can be overriden right from the browser debugger tools so it's not effective to prevent right clicking on the elements.