0

I have used this script and I was wondering if it's possible to prevent the dragging of image when it is at the edge of the div window inside html?

Here is the link:

<https://jsfiddle.net/61t6nn4a/2/>

Any tips would be awesome thank you.

popoydotcom
  • 3
  • 3

1 Answers1

2

You can make your life easier by using jQuery.

jQueryUI has a draggable functionnality, check the documentation here : http://api.jqueryui.com/draggable/

HTML:

<div class="container">
    <img src="http://www.zpixel.com/staging/test/image.png" class="dragme">
</div>

JS:

$(".dragme").draggable({
    containment: ".container"
});

Here is the JSFiddle : https://jsfiddle.net/v28r9v3r/1/

Rust in Peace
  • 176
  • 2
  • 8
  • Thank you will keep this! Although I'm trying to make this work via pure javascript due to client restrictions. Crap. – popoydotcom Jul 04 '16 at 04:05
  • Well, you can check this jsfiddle: https://jsfiddle.net/ryuofpaL/ It's from this guy: http://stackoverflow.com/a/25933582/6335043 – Rust in Peace Jul 04 '16 at 04:41
  • Thanks Leo, but I might use the image as html, not background. Will see if this can be useful. Cheers! – popoydotcom Jul 04 '16 at 05:07
  • If the answer resolved your problem, please mark it as the [correct answer](http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work) ;) – Rust in Peace Jul 05 '16 at 12:08