What's the proper way to declare an attribute to be false?

Question

In HTML5, you can add the attribute draggable to any element -- it works like checked ; it doesn't require a value. If you do want to specify a value (eg to make it valid XML), I think the official standard syntax is checked="checked" , but other things work too (including checked="" and checked="false" , confusingly). The standard way to make it 'false' is not to include the attribute at all.

<img> elements seem to be 'draggable' by default (even if you don't include a draggable attribute) – that's why you get the 'ghost' image effect when you drag regular images in web pages. You get this same effect on non- img elements if you mark them draggable .

So how do you disable it on img elements? You can set the property to false in JavaScript. But what about in the HTML?

(From experimenting, I know that draggable="false" seems to work in Chrome – is that a standard syntax that works everywhere? If so, why doesn't checked="false" work the same way?)

Answer 1

Well, W3C says you're right; "true", "false" and "auto" should work (not to say it will everywhere).

Edit: http://jsfiddle.net/nwellcome/DRSbc/ for to experiment with in different browsers.

Answer 2

Take a look here (scroll to 'Global Attributes' and click draggable ).

All HTML elements may have the draggable content attribute set. The draggable attribute is an enumerated attribute. It has three states. The first state is true and it has the keyword true. The second state is false and it has the keyword false. The third state is auto; it has no keywords but it is the missing value default.

The true state means the element is draggable; the false state means that it is not. The auto state uses the default behavior of the user agent.

So the answer is: to disable the draggable attribute for a HTML5 element, use draggable="false"