X
Tap here to go to the mobile version of the site.
An updated version of Firefox is available to address the issues with Add-ons disabled or fail to install on Firefox. You can download the update for your OS here: https://www.mozilla.org/firefox/new/ For Known Issues and Workarounds, please check out the update at https://support.mozilla.org/kb/add-ons-disabled-or-fail-to-install-firefox

منتدى الدعم

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

Additional System Details

Installed Plug-ins

none

Application

  • User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36

More Information

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