0

I have a large background image on a div that is 100% x 100%. what i would like is when the user comes to the site they are able to drag around the background image so they can view it all but have constraints on how far they can drag it horizontally and vertically so if they reach those constraints it wont let them drag any further.

here is a perfect example on what i would like to acheive - http://irrland.sonntagskunst.de/

If you could point me in the right direction that would be much appreciated.

thanks in advance

saunders
  • 969
  • 4
  • 14
  • 25

1 Answers1

0

partial solution but on the right track I think:

http://jsfiddle.net/cSKq2/2/

kudos to https://stackoverflow.com/users/772035/paulpro who I ripped it from 'onmousedrag' event js

Community
  • 1
  • 1
Joseph Marikle
  • 76,418
  • 17
  • 112
  • 129
  • i would prefer if it was on a click event rather than this mousedrag. but there is a problem i dont understand is that it only moves at a certain corner. not actually moving the background around – saunders Jul 25 '11 at 18:47
  • and that's why I said it was incomplete. Currently it just sets the corner of the image to where the mouse is. You would have to set up a couple of variables to offset it. – Joseph Marikle Jul 25 '11 at 18:57