Not signed in (Sign In)

SkillShare - A place to discuss Web Standards and Web Design topics

Categories

Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.

JavaScript / DOM / AJAX: Drag Image Inside Div Only?

Bottom of Page

1 to 4 of 4

  1.  
    • CommentAuthorguyute91
    • CommentTimeSep 29th 2006
     permalink
    Basicly I need to "copy" Google Maps. And be able to drag (and if possible zoom in) a custom map that I have created of the town I live in. It is being used for a Chamber of Commerce website and displays all business and parking lots, etc. What framework allows the dragging of images but only within a specified div?

    Any help would be appreciated.

    --
    Thank You,
    Frank
    •  
      CommentAuthorJohnRiv
    • CommentTimeOct 2nd 2006
     permalink
    Basically, you need 2 divs, one div with the map image(s) inside of an outside container. Apply an 'overflow: hidden;' style to the outside container div, and setup your javascript to only allow dragging of the inside div when your mouse is over the outside container div.

    The guys at Ajaxian have written a book called Pragmatic Ajax that includes a chapter on creating your own custom draggable + zoomable map. It has all the code you need to make it work, so I'd definitely recommend checking it out!
    • CommentAuthorremiped
    • CommentTimeOct 2nd 2006 edited
     permalink
    Guyute91,

    I would like to see how your map turns out for the Chamber. When your project is complete, could you post the URL here?

    Thanks!
    • CommentAuthorguyute91
    • CommentTimeOct 3rd 2006
     permalink
    Thanks guys I will look into that. Whatever I come up with, I will post the URL here!

    --
    Thank You,
    Frank

1 to 4 of 4

  1.  
Add your comments
    Username Password
  • Format comments as (Help)
 
Back to Discussions Top of Page