Dragdrop.js | Javascript package implements drag-n-drop functionality | Frontend Framework library

I'm creating a little HTML game where you can drag and drop different items on to a predefined spot. It's for a game where you can create a burger with different ingredients. Now, I want a way of moving the different div's (you drag divs with an image on them) back when someone drags them. So they can't overlap and always come back to the same spot.

Yes, I did my research and as far as I can find so far I am unable to figure out why seemingly out of nowhere the product tabs are no longer functioning as expected. In the Console, I see:

I've been continuing my work on a drag and drop page that will parse and display the json data.

I was able to parse the .json file and showed it in console but at the end there is an error showing up (Please refer on the screenshot below). Did I miss anything from my code? Thank you in advance!

JSFiddle : https://jsfiddle.net/vy19a7sf/2/

I am trying to create a drag and drop game in Qualtrics using javascript. I intend to use Prototype.js and Scriptaculous.js libraries. To start with, I just wanted to replicate the simple droppables DEMO code in:

http://madrobby.github.io/scriptaculous/droppables/

I did the following:

1) In Qualtrics > Library > Files Library, I uploaded the latest scriptaculous.js, effects.js, and dragdrop.js files.

2) In the Survey > Look & Feel > Header, I inserted these three files from the library in that order. [I have also tried doing this in the footer which some suggest is the 'correct' approach, but it does not make any difference to the problem I describe here]

3) In the Survey > Look & Feel > CSS Editor, I insert the following code:

I'm on a 1.9.3 Magento installation, trying to optimize the existing application. There is a custom theme, which defines the custom layouts where I found a big mess: duplicated files everywhere, totally absurd overwriting of core behavior, so I tried to tidy up everything, and after one day I succedeed, unless for something really strange that happens in the last step.

I have 2 main layout files: local.xml and page.xml and I wanted to merge them in a single file.

Everything works well, until I put all the custom head behavior (cleaned uploaded assets in the single sections), but everything stops working as soon as I merge the custom pages layout.

What I mean is:

page.xml

Any reference to googleapis will block my website in China. How can I remove these references?

Here are the results of my grep search for google api reference:

My website is not work okay, I check the console and all my js files have this error:

When I disable js merge it is merged again automatically. I don't know how. I there any way to check why or how it is happening?

If js is merged Admin menu and submit button is not working. I tried to change the sequence of js files in main.xml as mentioned below, it didn't work.

1. Always include jQuery before any other script on your page, before Prototype is a must.
2. Add jQuery.noConflict(); call directly to the end of your jQuery library file.

My main concern is, js should not merge automatically.

my main.xml file

I've two separate div's with angular-material tabs (md-tabs). Using angular drag and drop library, I'm trying to drag the content (button) from one Tabs to another. But while dragging, the button is moving along with the same div. i.e., the button is hiding after it reaches the border (overflow).

If I try to do the same with normal div, it is working fine.

I try to change the position and z-index of the button, but it didn't work properly.

The code details is below. Demo