Đã Đóng

ajax farmville-style functionality

I'm a php programmer building a site that needs a bit of ajax functionality. What I need is just a small script that will provide this functionality and I will then modify it to use on my website. So, you do not need to create an entire web application or an entire program, just one script.

Here's what I need:

Imagine a web page with an image of a 100 pixel square on it. Below that, there is a green div rectangle of 500 x 400 pixels.

If a person clicks on the square, their cursor changes to an image cursor instead (for example an image of a tool), when they move their cursor to the rectangle below, an additional square appears below their cursor (as if they were dragging it), they can then place it anywhere in that rectangle with a snap to grid functionality by clicking down. Once they place it with a click, a copy of the square stays in place within the rectangle wherever they clicked down. A new square appears below their cursor and they can again (with a snap to grid functionality) place the new square easily next to the existing one (or anywhere else they want within the rectangle). They can keep doing this as long as they want. When their cursor leaves the rectangle the square that was attached to their cursor disappears. When they click on any other button, the cursor changes back to a regular cursor.

This sounds complex, but basically what I need is similar to what you do in farmville when you click on the picture of a hoe. Your cursor changes to a small hoe and an outline of a square appears under your cursor in any area where you can place the square (in my version that's only within the rectangle). You can then move your cursor around (and the square moves with you) and click down anywhere to place it. A new square appears and you can place that next to or below your existing one (this is where the snap to grid is important to make it easy to position squares next to each other) or anywhere else you want.

If you've ever played farmville you know what I mean. In farmville it's done with flash, and I need it done with javascript instead. It is for a gardening design tool, that's why the functionality is similar to farmville. Again, I only need one html page with javascript that gives me the functions I need to do the above things. I'll then build my tool around it and customize it to my needs. I already know how to turn a cursor into a custom image, the main thing I don't know how to do is make the square appear when you're in the rectangle, to make it snap to a grid when you place it, and to make another copy of the square appear as soon as you've placed it. You can use whatever images you want, just make some blank ones. It doesn't matter since I'll change it to whatever images I need.

I tried doing this myself using the drag and drop functionality that comes with jquery (which has a nice snap to grid function), but it doesn't allow you to drag and drop without holding down the left button. I need it to work without having to hold down the left button.

Here's a link to my sample page for this:
I'm also attaching the files for this page.

Please let me know if I need to clarify something about the project.

Kĩ năng: AJAX, Javascript

Xem nhiều hơn: ajax farmville, work style, why do you want this position, where played, what's ajax, what is your work style, what is my design style, what a person needs to create a web page, website div create how, web design drag and drop, turn website into application, things to know when building a website, style by design, snap programmer, snap on, php style, make a picture of myself, i want to know how to design a web site, hold tool, hoe to make a website, Green Building design, green building and design, easy design tool, drag and drop web design, build whatever you want

Về Bên Thuê:
( 0 nhận xét ) Pflugerville, United States

ID dự án: #1030083

2 freelancer đang chào giá trung bình $175 cho công việc này


ajax/php experienced

$250 USD trong 3 ngày
(9 Nhận xét)

Hello I am highly interested in ur project. Please check PMB.

$100 USD trong 3 ngày
(3 Nhận xét)