Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 11 of 11
  1. #1
    Regular Coder
    Join Date
    Aug 2009
    Posts
    411
    Thanks
    119
    Thanked 0 Times in 0 Posts

    stop visitors from dragggin pics to their desktop

    i have a site where i want to take steps to block visitors from taking pictures from the site. yes, i know its impossible to fully block this from happening. but the visitors to this type of site arent that web savvy so...

    anyway, i've put in javascript code to stop people from right clicking and saving the images. however people can still left click on an image, hold the mouse button down, then drag it to their desktop. any ideas on how to stop protect against this?

    thanks!

  • #2
    UE Antagonizer Fumigator's Avatar
    Join Date
    Dec 2005
    Location
    Utah, USA, Northwestern hemisphere, Earth, Solar System, Milky Way Galaxy, Alpha Quadrant
    Posts
    7,691
    Thanks
    42
    Thanked 637 Times in 625 Posts
    It's a futile effort, but you may be able to work something out using jQuery's UI and the "draggable" function, say, put a callback function on the "start dragging" event which pops up an alert box saying "please don't steal my art".

    http://jqueryui.com/demos/draggable/

  • #3
    UE Antagonizer Fumigator's Avatar
    Join Date
    Dec 2005
    Location
    Utah, USA, Northwestern hemisphere, Earth, Solar System, Milky Way Galaxy, Alpha Quadrant
    Posts
    7,691
    Thanks
    42
    Thanked 637 Times in 625 Posts
    I was curious how well this would work and come to find out it works quite well. You'll need to use the files I attached to see it in action. (I would upload the test page somewhere but I'm not at home)

    PHP Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd"
    >
    <
    html>

    <
    head>
    <
    title>Drag Alert Test</title>

    <
    meta http-equiv="content-type"    content="text/html;charset=utf-8">
    <
    meta http-equiv="Content-Style-Type" content="text/css" >
    <
    style type="text/css">
    .
    warning {
        
    padding20px;
        
    width450px;
        
    border10px solid #900;
        
    background-color#000;
        
    font-size:2em;
        
    font-weight:bold;
        
    color:#f00;
    }
    </
    style>    
    <
    script type="text/Javascript" src="jquery-1.3.2.min.js"></script>
    <script type="text/Javascript" src="jquery-ui-1.7.2.custom.min.js"></script>
    <script type="text/Javascript">

    $(function() {
            $("#draggable").draggable({
                revert: true,
                opacity: 0.7,
                cursor: 'progress',
                cursorAt: { top: -12, left: -20 },
                helper: function(event) {
                    return $('<div class="warning">You are illegally attempting to steal my copyrighted stuff.  STOP IT!</div>');
                },
                //stop: function() {
                //    alert("Don't even try it, sucka!");
                //}
            });
        });

    </script>
    </head>
    <body>

    <div id="draggable" class="ui-widget ui-widget-content">
        <img src="img/test.png" />
    </div>

    </body>
    </html> 
    Attached Files Attached Files

  • #4
    Senior Coder tomws's Avatar
    Join Date
    Nov 2007
    Location
    Arkansas
    Posts
    2,644
    Thanks
    29
    Thanked 330 Times in 326 Posts
    I wonder if a transparent overlay div would work for this. Granted, it's extra code and can get sloppy underneath. I've never tried it myself - never thought of it before.
    Are you a Help Vampire?

  • #5
    Senior Coder
    Join Date
    Dec 2005
    Location
    Slovenia
    Posts
    1,994
    Thanks
    120
    Thanked 76 Times in 76 Posts
    look here:
    http://www.slo-foto.net/galerija_slika-56031.html

    they have transparent jpg, and you can't drag as far as I can see.

  • #6
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    It's yours.

    The transparent png is easily dragged to your desktop, that is if you want a transparent png.

    Frank
    Last edited by effpeetee; 10-12-2009 at 05:12 PM.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #7
    Regular Coder seco's Avatar
    Join Date
    Nov 2008
    Location
    Oregon
    Posts
    687
    Thanks
    6
    Thanked 79 Times in 77 Posts
    there is no way to keep people from taking anything on the net. I would just skip this part and move on.

  • #8
    Senior Coder tomws's Avatar
    Join Date
    Nov 2007
    Location
    Arkansas
    Posts
    2,644
    Thanks
    29
    Thanked 330 Times in 326 Posts
    Quote Originally Posted by seco View Post
    there is no way to keep people from taking anything on the net. I would just skip this part and move on.
    You may have missed this:

    Quote Originally Posted by sixrfan View Post
    yes, i know its impossible to fully block this from happening. but the visitors to this type of site arent that web savvy so...
    Are you a Help Vampire?

  • #9
    Regular Coder seco's Avatar
    Join Date
    Nov 2008
    Location
    Oregon
    Posts
    687
    Thanks
    6
    Thanked 79 Times in 77 Posts
    its a 50/50 toss up for non web savvy these days. In the past ive done somthing along the lines of

    Code:
    <img src="blank.gif" style="background: url(photo.jpg);" />
    of course it needs more attributes but thats the best way with the least work, you just dont want to use JS cause if its disabled its not helpfull.

  • #10
    Master Coder
    Join Date
    Dec 2007
    Posts
    6,682
    Thanks
    436
    Thanked 890 Times in 879 Posts
    Quote Originally Posted by sixrfan View Post
    i have a site where i want to take steps to block visitors from taking pictures from the site. yes, i know its impossible to fully block this from happening. but the visitors to this type of site arent that web savvy so...

    anyway, i've put in javascript code to stop people from right clicking and saving the images. however people can still left click on an image, hold the mouse button down, then drag it to their desktop. any ideas on how to stop protect against this?

    thanks!
    try this:
    http://www.htaccesstools.com/hotlink-protection/

    best regards

  • #11
    Regular Coder
    Join Date
    Mar 2009
    Posts
    107
    Thanks
    15
    Thanked 0 Times in 0 Posts
    i think the best, quickiest and easiest way is just to set the image as a background.

    insert a table without a border and 00 padding and spacing, set it to the size you want and set your table background as the image.

    cant be dragged , or right clicked and saved.

    can however be screenshoted and the url can be found in the scource,
    but you could put a watermark over, block right clicks, and dsguise the section of the scource code....... with aload of ///note mumbo jumbo , and usless javascript codes.

    but to my knowledge theres no way to completeley stop people taking images unless you can disable screenprint.

    hope this helps


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •