X
Tap here to go to the mobile version of the site.

منتدى الدعم

Inset CSS property is messing our WordPress plugin which has draggable elements with jQuery

  • No replies
  • 1 has this problem
  • 6 views
Posted

To our elements which are draggable instead of top and left properties, these are assigned: https://developer.mozilla.org/en-US/docs/Web/CSS/inset This is an experimental feature only supported by Firefox.

The problem is we have to save the whole HTML document. And it is saved with INSET css which means when someone opens it in google everything crashes. Like the whole seating chart is messed up.

How can we disable INSET option from showing at all and experimenting our plugin?

We use jQuery draggable function.

example code:

               $(this).draggable({
                   grid: [grid_size * window.tc_seat_zoom_level, grid_size * window.tc_seat_zoom_level],
                   handle: $(this).find('.tc-seat-group .tc-heading'),
                   start: function (event, ui) {
                       ui.position.left = 0;
                       ui.position.top = 0;
                   },
                   drag: function (event, ui) {
                       var changeLeft = ui.position.left - ui.originalPosition.left; // find change in left
                       var newLeft = (ui.originalPosition.left + changeLeft) / window.tc_seat_zoom_level; // adjust new left by our zoomScale
                       var changeTop = ui.position.top - ui.originalPosition.top; // find change in top
                       var newTop = (ui.originalPosition.top + changeTop) / window.tc_seat_zoom_level; // adjust new top by our zoomScale
                       ui.position.left = newLeft;
                       ui.position.top = newTop;
                   }
               });

Thanks

To our elements which are draggable instead of top and left properties, these are assigned: https://developer.mozilla.org/en-US/docs/Web/CSS/inset This is an experimental feature only supported by Firefox. The problem is we have to save the whole HTML document. And it is saved with INSET css which means when someone opens it in google everything crashes. Like the whole seating chart is messed up. How can we disable INSET option from showing at all and experimenting our plugin? We use jQuery draggable function. example code: $(this).draggable({ grid: [grid_size * window.tc_seat_zoom_level, grid_size * window.tc_seat_zoom_level], handle: $(this).find('.tc-seat-group .tc-heading'), start: function (event, ui) { ui.position.left = 0; ui.position.top = 0; }, drag: function (event, ui) { var changeLeft = ui.position.left - ui.originalPosition.left; // find change in left var newLeft = (ui.originalPosition.left + changeLeft) / window.tc_seat_zoom_level; // adjust new left by our zoomScale var changeTop = ui.position.top - ui.originalPosition.top; // find change in top var newTop = (ui.originalPosition.top + changeTop) / window.tc_seat_zoom_level; // adjust new top by our zoomScale ui.position.left = newLeft; ui.position.top = newTop; } }); Thanks
Quote

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.