parkerblush
New Member
I try to implement drag&drop from my DOM to an Iframe. So I tried a code which works perfectly on Firefox but not in Chrome.Here is the code :Iframe (iframetest.html):\[code\]<!DOCTYPE html><html><head> <title>jQuery UI Draggable - inner html</title> <link rel="stylesheet" href="http://jqueryui.com/themes/base/jquery.ui.all.css"> <script src="http://code.jquery.com/jquery-1.8.3.js"></script> <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> <link rel="stylesheet" href="http://jqueryui.com/demos/demos.css"> <style> .DroppableDiv { background-color: Gray; height: 500px; width: 500px; } </style></head><body style="cursor: auto;"> <div class="DroppableDiv"> </div></body></html>\[/code\]and my main page is :\[code\]<!DOCTYPE html><html><head> <title>jQuery UI Draggable</title> <link rel="stylesheet" href="http://jqueryui.com/themes/base/jquery.ui.all.css"> <script src="http://code.jquery.com/jquery-1.8.3.js"></script> <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> <link rel="stylesheet" href="http://jqueryui.com/demos/demos.css"> <script type="text/javascript"> $(function () { $("#FirstDiv").draggable({ revert: "invalid",iframeFix: true, }); $("#SecondDiv").draggable({ revert: "invalid", iframeFix: true,}); $("#frame").load(function () { var $this = $(this); var contents = $this.contents(); // here, catch the droppable div and create a droppable widget contents.find('.DroppableDiv').droppable({ iframeFix: true, drop: function (event, ui) { alert('dropped'); } }); }); }); </script></head><body style="cursor: auto;" ><div class="demo"><div id="mainDiv" style="background-color: #FAE6B6; height:200px"><div id="FirstDiv" style=" border-style:solid; border-width:1px; font-size:medium; height:20px; width:300px">First Div</div><div id="SecondDiv" style=" border-style:solid; border-width:1px; font-size:medium; height:20px; width:300px">Second Div</div></div></div><iframe id="frame" src="http://stackoverflow.com/questions/14042799/iframetest.html" style="width: 800px; height: 400px"></iframe></body></html>\[/code\]So my question is simple, why it doesn't work on Chrome ?Thanks for your help !