Demo of iframeFix option for Dragging elements in JQuery UI

Drag me around













HTML

<div id="draggable" class='drg_box'>
  <p>Drag me around</p>
</div>
<br><br><br><br><br><br><br>
<button  id=b1>Ture</button><button  id=b2>false</button><br>
<div id=d1></div>
<br><br><br><br>
<iframe src="https://www.plus2net.com" style="border:medium solid black"></iframe>

jquery

<script>
$(document).ready(function() {
////////////////
$( "#draggable" ).draggable({
iframeFix: false
});
//////
$("#b1").click(function(){
$( ".drg_box" ).draggable( "option", "iframeFix", true );
var iframeFix = $( ".drg_box" ).draggable( "option", "iframeFix" );
$('#d1').html("iframeFix value is " + iframeFix);
})
//////////////
$("#b2").click(function(){
$( ".drg_box" ).draggable( "option", "iframeFix", false );
var iframeFix = $( ".drg_box" ).draggable( "option", "iframeFix" );
$('#d1').html("iframeFix value is " + iframeFix);
})
//////////////
var iframeFix = $( ".drg_box" ).draggable( "option", "iframeFix" );
$('#d1').html("iframeFix value is " + iframeFix);
/////
})
</script>