SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Member Python's Avatar
    Join Date
    May 2004
    Location
    UK
    Posts
    12
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Select area of an image

    I am working on a web site which allows users to sell their digital products (its basically an auction). When users are browsing through the items which users have put on sale it displays a 150x150 preview image of the product.

    When the seller submits his product onto the site they must upload a photo which is an example of the product. The only problem is that not everyone is going to upload a 150x150 size image. I know i can restrict it to only this size but this just causes hassle and makes it less easier for the user to use.

    So what I want is this... Once the user has uploaded the image to the server (done by PHP, uploading part is done) I want a page to show the image and on top of it a draggable 150x150 rectangle with just a border. They then drag this rectangle around over the top of the image which is selecting what part of the image to use as the preview image.

    When they click on a button I need the coordinates of the rectangle relative to the image to be passed to my PHP script which will then slice out the preview image.

    Its the javascript part (with the draggable box) I need help with.

    Thanks
    UK Web Site Design
    - Affordable web site design solutions

  2. #2
    SitePoint Enthusiast
    Join Date
    Sep 2005
    Posts
    50
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try Yahoo's YUI drag and drop interface.

  3. #3
    SitePoint Addict Mirek Komárek's Avatar
    Join Date
    Dec 2006
    Location
    Prague
    Posts
    210
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

  4. #4
    SitePoint Member Python's Avatar
    Join Date
    May 2004
    Location
    UK
    Posts
    12
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks
    UK Web Site Design
    - Affordable web site design solutions


Bookmarks

Posting Permissions

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