While dragging, as shown in the image below, you will see that the cursor (crosshairs) jumps to a location that is about 150 pixels higher than the element that is being dragged, which is a result of the jump.<\/p>\r\n\r\n![\"jumping](\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png\")
\r\n\r\n
Below is the initial HTML and jQuery:<\/p>\r\n\r\n
HTML<\/h4>\r\n\r\n\r\n<div id=\"sortable\">\r\n <div>Box one<div>\r\n <div>Box two<div>\r\n<div>\r\n<\/div>\r\n<\/pre>\r\n\r\njQuery<\/h4>\r\n$('#sortable').sortable({\r\n cursor: \"move\",\r\n});\r\n\r\n$('#sortable').draggable();\r\n<\/code><\/pre>\r\n\r\nThis may be the result of padding or a margin applied to the parent element. In this example, there was a negative margin of -7.5px that assigned to the parent element by an external css file named module-layout.min.css.<\/p>\r\n
Solution<\/h4>\r\n
The solution was to override the negative margin and set to zero. As a result the elements no longer jumped and the dragging effect was much smoother.<\/p>","protected":false},"excerpt":{"rendered":"Element jumps when using Bootstrap and jQuery UI Sortable If your website is using jQuery UI Sortable, you may experience a jumping effect when you begin to drag containers or box elements. Some solutions suggest using the jQuery Draggable Widget cursorAt: option, however, this did not prevent the elements from jumping. While dragging, as shown […]","protected":false},"author":2,"featured_media":22,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"spay_email":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false},"categories":[5,2],"tags":[],"yoast_head":"\n
Prevent HTML element from jumping \u2013 jQuery UI Sortable<\/title>\n<meta name=\"description\" content=\"If you are using Bootstrap, you may wind up experiencing elements jumping when you begin to drag them when using the jQuery UI Sortable widget.\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Prevent HTML element from jumping \u2013 jQuery UI Sortable\" \/>\n<meta property=\"og:description\" content=\"If you are using Bootstrap, you may wind up experiencing elements jumping when you begin to drag them when using the jQuery UI Sortable widget.\" \/>\n<meta property=\"og:url\" content=\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Development Reference\" \/>\n<meta property=\"article:published_time\" content=\"2016-02-10T20:00:36+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-05-02T14:19:37+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png\" \/>\n\t<meta property=\"og:image:width\" content=\"874\" \/>\n\t<meta property=\"og:image:height\" content=\"327\" \/>\n<meta name=\"twitter:card\" content=\"summary\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\">\n\t<meta name=\"twitter:data1\" content=\"1 minute\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#website\",\"url\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/\",\"name\":\"Web Development Reference\",\"description\":\"Web Development Solutions Explained -- Easy\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png\",\"contentUrl\":\"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png\",\"width\":874,\"height\":327,\"caption\":\"HTML element jumping when using jQuery UI sortable\"},{\"@type\":\"WebPage\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#webpage\",\"url\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\",\"name\":\"Prevent HTML element from jumping \\u2013 jQuery UI Sortable\",\"isPartOf\":{\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#website\"},\"primaryImageOfPage\":{\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#primaryimage\"},\"datePublished\":\"2016-02-10T20:00:36+00:00\",\"dateModified\":\"2017-05-02T14:19:37+00:00\",\"author\":{\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#\/schema\/person\/9624bee17e4fbdcaad7eb7569f5faa70\"},\"description\":\"If you are using Bootstrap, you may wind up experiencing elements jumping when you begin to drag them when using the jQuery UI Sortable widget.\",\"breadcrumb\":{\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"item\":{\"@type\":\"WebPage\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/\",\"url\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"position\":2,\"item\":{\"@type\":\"WebPage\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\",\"url\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\",\"name\":\"Element jumps when using jQuery UI Sortable\"}}]},{\"@type\":\"Person\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#\/schema\/person\/9624bee17e4fbdcaad7eb7569f5faa70\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/c0c4e0ed219e3aaa419ce72b52646d59?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/c0c4e0ed219e3aaa419ce72b52646d59?s=96&d=mm&r=g\",\"caption\":\"admin\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","jetpack_featured_media_url":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png","jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p7o7aF-4","_links":{"self":[{"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/posts\/4"}],"collection":[{"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/comments?post=4"}],"version-history":[{"count":29,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/posts\/4\/revisions"}],"predecessor-version":[{"id":211,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/posts\/4\/revisions\/211"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/media\/22"}],"wp:attachment":[{"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/media?parent=4"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/categories?post=4"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/tags?post=4"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
\r\n<div id=\"sortable\">\r\n <div>Box one<div>\r\n <div>Box two<div>\r\n<div>\r\n<\/div>\r\n<\/pre>\r\n\r\njQuery<\/h4>\r\n
jQuery<\/h4>\r\n$('#sortable').sortable({\r\n cursor: \"move\",\r\n});\r\n\r\n$('#sortable').draggable();\r\n<\/code><\/pre>\r\n\r\nThis may be the result of padding or a margin applied to the parent element. In this example, there was a negative margin of -7.5px that assigned to the parent element by an external css file named module-layout.min.css.<\/p>\r\n
Solution<\/h4>\r\n
The solution was to override the negative margin and set to zero. As a result the elements no longer jumped and the dragging effect was much smoother.<\/p>","protected":false},"excerpt":{"rendered":"Element jumps when using Bootstrap and jQuery UI Sortable If your website is using jQuery UI Sortable, you may experience a jumping effect when you begin to drag containers or box elements. Some solutions suggest using the jQuery Draggable Widget cursorAt: option, however, this did not prevent the elements from jumping. While dragging, as shown […]","protected":false},"author":2,"featured_media":22,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"spay_email":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false},"categories":[5,2],"tags":[],"yoast_head":"\n
Prevent HTML element from jumping \u2013 jQuery UI Sortable<\/title>\n<meta name=\"description\" content=\"If you are using Bootstrap, you may wind up experiencing elements jumping when you begin to drag them when using the jQuery UI Sortable widget.\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Prevent HTML element from jumping \u2013 jQuery UI Sortable\" \/>\n<meta property=\"og:description\" content=\"If you are using Bootstrap, you may wind up experiencing elements jumping when you begin to drag them when using the jQuery UI Sortable widget.\" \/>\n<meta property=\"og:url\" content=\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Development Reference\" \/>\n<meta property=\"article:published_time\" content=\"2016-02-10T20:00:36+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-05-02T14:19:37+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png\" \/>\n\t<meta property=\"og:image:width\" content=\"874\" \/>\n\t<meta property=\"og:image:height\" content=\"327\" \/>\n<meta name=\"twitter:card\" content=\"summary\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\">\n\t<meta name=\"twitter:data1\" content=\"1 minute\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#website\",\"url\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/\",\"name\":\"Web Development Reference\",\"description\":\"Web Development Solutions Explained -- Easy\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png\",\"contentUrl\":\"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png\",\"width\":874,\"height\":327,\"caption\":\"HTML element jumping when using jQuery UI sortable\"},{\"@type\":\"WebPage\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#webpage\",\"url\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\",\"name\":\"Prevent HTML element from jumping \\u2013 jQuery UI Sortable\",\"isPartOf\":{\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#website\"},\"primaryImageOfPage\":{\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#primaryimage\"},\"datePublished\":\"2016-02-10T20:00:36+00:00\",\"dateModified\":\"2017-05-02T14:19:37+00:00\",\"author\":{\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#\/schema\/person\/9624bee17e4fbdcaad7eb7569f5faa70\"},\"description\":\"If you are using Bootstrap, you may wind up experiencing elements jumping when you begin to drag them when using the jQuery UI Sortable widget.\",\"breadcrumb\":{\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"item\":{\"@type\":\"WebPage\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/\",\"url\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"position\":2,\"item\":{\"@type\":\"WebPage\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\",\"url\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\",\"name\":\"Element jumps when using jQuery UI Sortable\"}}]},{\"@type\":\"Person\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#\/schema\/person\/9624bee17e4fbdcaad7eb7569f5faa70\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/c0c4e0ed219e3aaa419ce72b52646d59?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/c0c4e0ed219e3aaa419ce72b52646d59?s=96&d=mm&r=g\",\"caption\":\"admin\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","jetpack_featured_media_url":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png","jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p7o7aF-4","_links":{"self":[{"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/posts\/4"}],"collection":[{"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/comments?post=4"}],"version-history":[{"count":29,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/posts\/4\/revisions"}],"predecessor-version":[{"id":211,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/posts\/4\/revisions\/211"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/media\/22"}],"wp:attachment":[{"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/media?parent=4"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/categories?post=4"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/tags?post=4"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
$('#sortable').sortable({\r\n cursor: \"move\",\r\n});\r\n\r\n$('#sortable').draggable();\r\n<\/code><\/pre>\r\n\r\nThis may be the result of padding or a margin applied to the parent element. In this example, there was a negative margin of -7.5px that assigned to the parent element by an external css file named module-layout.min.css.<\/p>\r\n
Solution<\/h4>\r\n
The solution was to override the negative margin and set to zero. As a result the elements no longer jumped and the dragging effect was much smoother.<\/p>","protected":false},"excerpt":{"rendered":"Element jumps when using Bootstrap and jQuery UI Sortable If your website is using jQuery UI Sortable, you may experience a jumping effect when you begin to drag containers or box elements. Some solutions suggest using the jQuery Draggable Widget cursorAt: option, however, this did not prevent the elements from jumping. While dragging, as shown […]","protected":false},"author":2,"featured_media":22,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"spay_email":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false},"categories":[5,2],"tags":[],"yoast_head":"\n
Prevent HTML element from jumping \u2013 jQuery UI Sortable<\/title>\n<meta name=\"description\" content=\"If you are using Bootstrap, you may wind up experiencing elements jumping when you begin to drag them when using the jQuery UI Sortable widget.\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Prevent HTML element from jumping \u2013 jQuery UI Sortable\" \/>\n<meta property=\"og:description\" content=\"If you are using Bootstrap, you may wind up experiencing elements jumping when you begin to drag them when using the jQuery UI Sortable widget.\" \/>\n<meta property=\"og:url\" content=\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Development Reference\" \/>\n<meta property=\"article:published_time\" content=\"2016-02-10T20:00:36+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-05-02T14:19:37+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png\" \/>\n\t<meta property=\"og:image:width\" content=\"874\" \/>\n\t<meta property=\"og:image:height\" content=\"327\" \/>\n<meta name=\"twitter:card\" content=\"summary\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\">\n\t<meta name=\"twitter:data1\" content=\"1 minute\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#website\",\"url\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/\",\"name\":\"Web Development Reference\",\"description\":\"Web Development Solutions Explained -- Easy\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png\",\"contentUrl\":\"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png\",\"width\":874,\"height\":327,\"caption\":\"HTML element jumping when using jQuery UI sortable\"},{\"@type\":\"WebPage\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#webpage\",\"url\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\",\"name\":\"Prevent HTML element from jumping \\u2013 jQuery UI Sortable\",\"isPartOf\":{\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#website\"},\"primaryImageOfPage\":{\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#primaryimage\"},\"datePublished\":\"2016-02-10T20:00:36+00:00\",\"dateModified\":\"2017-05-02T14:19:37+00:00\",\"author\":{\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#\/schema\/person\/9624bee17e4fbdcaad7eb7569f5faa70\"},\"description\":\"If you are using Bootstrap, you may wind up experiencing elements jumping when you begin to drag them when using the jQuery UI Sortable widget.\",\"breadcrumb\":{\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"item\":{\"@type\":\"WebPage\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/\",\"url\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"position\":2,\"item\":{\"@type\":\"WebPage\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\",\"url\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/html-element-jumping-jquery-ui-sortable\/\",\"name\":\"Element jumps when using jQuery UI Sortable\"}}]},{\"@type\":\"Person\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#\/schema\/person\/9624bee17e4fbdcaad7eb7569f5faa70\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"http:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/c0c4e0ed219e3aaa419ce72b52646d59?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/c0c4e0ed219e3aaa419ce72b52646d59?s=96&d=mm&r=g\",\"caption\":\"admin\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","jetpack_featured_media_url":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-content\/uploads\/2016\/02\/Capture.png","jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p7o7aF-4","_links":{"self":[{"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/posts\/4"}],"collection":[{"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/comments?post=4"}],"version-history":[{"count":29,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/posts\/4\/revisions"}],"predecessor-version":[{"id":211,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/posts\/4\/revisions\/211"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/media\/22"}],"wp:attachment":[{"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/media?parent=4"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/categories?post=4"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dev.pixelprofessionals.com\/webdevelopmentreference\/wp-json\/wp\/v2\/tags?post=4"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}