2013-09-03 23 views
6

Spędziłem dzień na zabawnym problemie - mam kilka płócien, które chciałbym przeciągnąć, korzystając z funkcji przeciągania i upuszczania HTML5. Wszystko działa wspaniale, z wyjątkiem tego, że ostatecznie znalazłem, że w Chrome 28.0.1500.95 domyślny obraz ducha płótna nie pojawia się, jeśli płótno jest elementem potomnym bloku div inline. Sprawdź tę minimalną pracy przykład: duch pojawia się obrazNieoczekiwane zachowanie przeciągania i upuszczania obrazu HTML5

<html> 
    <body> 
     <div style='display:inline-block'> 
      <canvas id='canvas1' width='100px' height='100px' draggable='true'></canvas> 
     </div> 

     <div> 
      <canvas id='canvas2' width='100px' height='100px' draggable='true'></canvas> 
     </div> 

     <script type="text/JavaScript"> 
      var canvas1, canvas2, context1, context2; 

      canvas1 = document.getElementById('canvas1'); 
      context1 = canvas1.getContext('2d'); 

      canvas2 = document.getElementById('canvas2'); 
      context2 = canvas2.getContext('2d'); 

      context1.fillText('no drag', 10, 30); 
      context2.fillText('yes drag', 10, 30); 
     </script> 
    </body> 
</html> 

gdy próbuję przeciągnąć „przeciągnij tak”, ale nie dla „bez oporu”. Jednakże, jeśli również trzymam się celu upuszczenia, mogę go wyzwolić, rzucając na niego "brak oporu", jak na normalne, pomimo nieobecności ducha. Chciałbym zrozumieć, dlaczego obraz ducha znika najwyraźniej w oparciu o CSS rodzica, lub jeśli dzieje się tu coś jeszcze - z góry dzięki!

Odpowiedz

0

Może to być po prostu błąd w Chrome (wydaje się działać w Firefoksie, gdy faktycznie .setData())

Jeśli szukasz po prostu łatwym, choć nieco złośliwym pracy wokół: .setDragImage() jawnie na podstawie płótno.

Fiddle (możesz chcieć trochę skrzypce z pozycją obrazu).

+0

Hmmm okej, obejście to działa, ale sądząc po ogólnej ciszy na ten temat, myślę, że to zwykły stary błąd. Dzięki! –

+0

Powiedz im: http://crbug.com/new Najgorsze, co może się stać, zamykają je jako nieważne i informują, dlaczego i co należy zrobić. ;) – nmaier

Powiązane problemy