jQuery Drag / Drop - Browser Comatible

This project was awarded to onlymaj for $100 USD.

Get free quotes for a project like this
Project Budget
$30 - $250 USD
Total Bids
Project Description

We have two videos that display the behavior problems:

Video 1: Problems in all browsers : [url removed, login to view]

Video 2: Problems in IE only : [url removed, login to view]


Users may drag (clone) any one of the 4 elements at the top into the dotted rectangle target container

Once dragged (update:) we replace the dropped div with a new div and give it a yellow border

The dropped items snap into place against the right most element within the dotted container.

HERE IS THE FIRST PART OF THE PROJECT NEEDS - Dragging to the dotted container

In Internet Explorer 8 & 9 only (these problems do not exist in firefox / chrome)

When you are dragging an item you will notice the dragged item appears behind the dotted container.

* Please Fix: They should always be in front of the container while being dragged over it.

When the dragged item is released, the dotted line container has its height increased and the dropped

item appears at the bottom of the container with about a 15px margin at its top.

* Please Fix: The dropped item should not cause the dotted containers height to grow. There should be

no gap above the dropped container.

Let us say there are already two items dragged into the dotted container. When we drag a third item

to a hover point between item 1 and item 2, we expect the behavior of jquery sortable to cause

items 1 and item 2 to seperate a little showing where item 3 could be dropped between. This behavior

does not happen. We can only place at the end.

* Please Fix: We would like to be able to drag 3,4,5 etc and place them between other items already

present in the container.

HERE IS THE SECOND PART OF THE PROJECT NEEDS - Dragging within the dotted container

All Browsers

When you click on the left most item to begin dragging to the right, it immediately causes the

items to its right to drop fall down well below the y position of the item being dragged.

* Please Fix: When items are dragged to the left or right neighboring items should remain at

the same horizontal level

We want to be able to freely move items to the left and right within the dotted container in a

predicable and intuitive fashion. At present the sortable behavior often fails to allow us

to move items into new positions.

* Please Fix: We should be able to smoothly move items to their left or right.


All Browsers

Items in the dotted container can be dragged over the trash. When this happens they are removed

from the dotted container. This behavior must not be adversely effected by any of the fixes you

employ above.

I expect you will complete this project in the number of days you commit to. If you do not, you must expect my recommendation of you will reflect this. Your word is all I have to decide on. If you do good work, we will use you again.




Awarded to:
Skills Required

Looking to make some money?

  • Set your budget and the timeframe
  • Outline your proposal
  • Get paid for your work

Hire Freelancers who also bid on this project

    • Forbes
    • The New York Times
    • Time
    • Wall Street Journal
    • Times Online