fast/html/draggable.html

<!DOCTYPE html>
<html>
<head>
<title>HTML5 Draggable</title>
<style>

[draggable="true"] {
    outline: 1px solid lime;
}

[draggable="false"] {
    outline: 1px solid pink;
}

</style>
<script>

function test()
{
    var elements = document.querySelectorAll('body > :not(h2)');

    for (var i = 16; i < 24; i++) {
        elements[i].draggable = i < 20;
    }

    var s = 'dom - attr\n----------\n';
    for (var i = 0; i < elements.length; i++) {
        s += elements[i].draggable + ' - ' + elements[i].getAttribute('draggable') + '\n';
    }

    var pre = document.createElement('pre');
    pre.textContent = s;
    document.body.appendChild(pre);
    
    if (window.testRunner)
        testRunner.dumpAsText();    
};

document.ondragstart = function(e)
{
    e.dataTransfer.setData('Text', e.target.textContent || e.target.src || e.target.href);
};

</script>
</head>
<body onload="test()">

<h2>Intrinsic</h2>

<img src="resources/images/lime.png">
<a href="http://webgkit.org">webkit.org</a>
<a>&lt;a no href&gt;</a>
<span>&lt;span&gt;</span>

<h2>draggable attr set to true</h2>

<img src="resources/images/lime.png" draggable="true">
<a href="http://webgkit.org" draggable="true">webkit.org</a>
<a draggable="true">&lt;a no href&gt;</a>
<span draggable="true">&lt;span&gt;</span>

<h2>draggable attr set to false</h2>

<img src="resources/images/lime.png" draggable="false">
<a href="http://webgkit.org" draggable="false">webkit.org</a>
<a draggable="false">&lt;a no href&gt;</a>
<span draggable="false">&lt;span&gt;</span>

<h2>draggable attr set to maybe</h2>

<img src="resources/images/lime.png" draggable="maybe">
<a href="http://webgkit.org" draggable="maybe">webkit.org</a>
<a draggable="maybe">&lt;a no href&gt;</a>
<span draggable="maybe">&lt;span&gt;</span>

<h2>draggable dom prop set to true</h2>

<img src="resources/images/lime.png">
<a href="http://webgkit.org">webkit.org</a>
<a>&lt;a no href&gt;</a>
<span>&lt;span&gt;</span>

<h2>draggable dom prop set to false</h2>

<img src="resources/images/lime.png">
<a href="http://webgkit.org">webkit.org</a>
<a>&lt;a no href&gt;</a>
<span>&lt;span&gt;</span>

</body>
</html>