HTML5ドラッグアンドドロップのsetDragImageのフィーチャー検出

Question

のための機能検出を行う方法はありますか？HTML5ドラッグアンドドロップ（JavaScriptまたはダーツ）のsetDragImage？

は私が持つ一般的なHTML5のドラッグ＆ドロップ機能の検出を行う（ guide to detecting everythingから）次

return 'draggable' in document.createElement('span'); 

これは、などのクロム、Firefoxの、およびIE10のためtrueを返します。 IE9にはfalseが返されます。

さて、問題はIE10である：それはHTML5のドラッグ＆ドロップのほとんどをサポートしていますが、setDragImageをサポートし、私はちょうどsetDragImage用ポリフィルを提供する必要がされていません。しかし、私はどのようにこれを検出する方法を把握することができませんでした。

Answer 1

以前の回答で述べた機能の検出は、Opera 12では失敗しました。setDragImageのサポートが主張されているだけなので、機能しません。リンクされているDartライブラリもOpera 12で完全に失敗し、コンソールに複数のエラーが発生します。

ゴーストイメージをポリフィルすることは実際には不可能です。ドキュメント要素を作成して適切な場所に配置しても、setDragImageを使わずにデフォルト要素を取り除くことはできません。

私が知っている唯一の解決策は、Opera 12とすべてのバージョンのIE（IE11を含む）をフィルタリングして、従来のマウスイベントスクリプトを使用してレガシーブラウザとして扱うことです。ダイレクト機能のテストが失敗したので、私は（すなわち、それらの特定のブラウザを検出するために、オブジェクトのテストを使用）間接オブジェクトのテストをお勧めします：

https://github.com/MihaiValentin/setDragImage-IE：

var hasNativeDraggable = (element.draggable && !(document.uniqueID || window.opera));

Answer 2

この解決策は、一般的なD & Dサポートが既にチェックされていることを前提としています。

のJavaScript（IE、Firefoxの、オペラとChromeでテスト）：

function test() { 
    var testVar = window.DataTransfer || window.Clipboard; // Clipboard is for Chrome 
    if("setDragImage" in testVar.prototype) { 
     window.alert("supported"); 
    } else { 
     window.alert("not supported"); 
    } 
} 

ダート：

私は "ネイティブ" ダーツのコードでこれを行う方法を見つけられませんでしたので、js-interopがあります行く道。

Answer 3

あなたはsetDragImageによって-IEポリフィルを使用することができます

これは、それが実際に（READMEから）どのように動作するかです：

私はあなたがに変更を加える場合には気づいdragstartイベント内の クラスの外観を変更して をすぐに削除すると、 は変更された要素のビットマップコピーとなり、ドラッグするために使用されます。 したがって、このライブラリが実際に実行するのは、 にドラッグして表示したい画像が含まれるクラスを追加してから、 を削除することによってターゲットの要素スタイルを変更するsetDragImage メソッドを実装することです。このようにして、ブラウザは一時的なスタイル をドラッグイメージとして表示します。