Best way to indicate "draggability" in a web app (or in general)?

I really cannot explain why, but the drag background icon thingy on the iphone makes some sense to me. Its just threee horizontal lines. In a web application that I develop and sell, people understood that immediately (well, on a classical "mouse UI" the mouse pointer gfx also changes to the former one you mentioned, thats some very important additional clue for mouse user interfaces).

I also immediately associated it with a draggable thing! Just three horizontal lines...

But then it only makes sense for some sort of draggable row or line. I don't know what's your intended application requires in detail.

The background (just three simple horizontal lines): alt text http://manjadigital.de/demo/s/d/f/c/a/sortierer_greifer.gif

Example usage on iPhone: alt text
(source: creativealgorithms.com)


Modern browsers support a grab/grabbing cursor:

.dragHandle {
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}
.dragHandle:active {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}

For more info (and a IE failover) read: http://uihacker.blogspot.com/2011/01/css-grab-hand-cursor.html