draggable

| references: drop, each

An article by Gaspard Bucher

define an element as being draggable

  1. action
  2. ajax
  3. API
  4. classes
  5. common attributes
    1. ..._if
    2. actions
    3. anchor
    4. attr
    5. date selection
    6. draggable
    7. eval
    8. label
    9. link params
    10. name
    11. prefix
    12. publish
    13. set_...
    14. status
    15. store
    16. text, t
    17. tlabel
    18. toggle
  6. conditions
  7. context
  8. dates
  9. display
  10. forms
  11. i18n
  12. meta
  13. SQLiss
  14. urls

Setting this value to “true” (or a class name) transform the tag into a draggable item by inserting a drag handle of class “drag_handle” or of the class provided with draggable='className'.

Example:

Zafu:

<td do='link' draggable='true'/>

html: 

<td id='list1_34'><a href...

result:
unknown document

The span tag is only inserted on drag activation by Javascript at the end of the page. They will therefore not appear if Javascript is disabled. Zena does not insert a tag if there is already one present with the given class.

all

If you want to make an element draggable by clicking anywhere on its surface, you have to use draggable='all'.

<r:img draggable='all'/>

You should not use ‘all’ option if your dragged element contains links because the click to drag would also trigger the link thus confusing the user.

revert

If revert is set to “remove”, the dragged element is removed from the page when dropped.

CSS & draggable

Making an element draggable changes its position to “relative”. This can produce some styling issues, especially if some <tr> tags are involved.