script.aculo.us Drag & Drop ghosting Option Last Updated : 28 Dec, 2020 Summarize Comments Improve Suggest changes Share Like Article Like Report The script.aculo.us library is a cross-browser library that aims at improving the user interface of a website. The Drag & Drop module can be used to make any element drag-gable and also enables them to be dropped in a drop zone. The ghosting option is used to specify if a clone of the element is made and that clone is moved instead of the original element until it is dropped. Its default value is ‘false’, which means no clone will be made default. Syntax: { ghosting: value } Parameters: This option has a single value as mentioned above and described below: value: This is a boolean value that specifies if a clone would be created when dragging. The default value is 'false'. The below example illustrates the use of this option. Example: HTML <!DOCTYPE html> <html> <head> <script type="text/javascript" src="prototype.js"> </script> <script type="text/javascript" src="scriptaculous.js"> </script> <script type="text/javascript"> window.onload = function () { // Draggable element with // ghosting set to true new Draggable('elem1', { ghosting: true }); // Draggable element with // ghosting set to false new Draggable('elem2', { ghosting: false }); }; </script> </head> <body> <div> <h1 style="color: green"> GeeksforGeeks </h1> </div> <strong> script.aculo.us Drag & Drop ghosting Option </strong> <p> Drag the elements to see the effect of the ghosting option. Element 1 has the ghosting set to 'true' and Element 2 has the ghosting set to 'false'. </p> <img id="elem1" src="elem1.png"> <img id="elem2" src="elem2.png"> </body> </html> Output: Comment More infoAdvertise with us Next Article script.aculo.us Drag & Drop ghosting Option S sayantanm19 Follow Improve Article Tags : JavaScript Web Technologies jQuery-Mobile Similar Reads script.aculo.us Drag & Drop onDrag Option The script.aculo.us library is a cross-browser library that aims at improving the user interface of a website. The Drag & Drop module can be used to make any element drag-gable and also enables them to be dropped in a drop zone. The onDrag option is used to specify a callback function that would 2 min read script.aculo.us Drag & Drop onStart Option The script.aculo.us library is a cross-browser library that aims at improving the user interface of a website. The Drag & Drop module can be used to make any element drag-gable and also enables them to be dropped in a drop zone. The onStart option is used to specify a callback function that woul 3 min read script.aculo.us Drag & Drop onEnd Option The script.aculo.us library is a cross-browser library that aims at improving the user interface of a website. The Drag & Drop module can be used to make any element drag-gable and also enables them to be dropped in a drop zone. The onEnd option is used to specify a callback function that would 3 min read script.aculo.us Drag & Drop onDrop Option This script.aculo.us Drag & Drop onDrop Option is used to call the callback function which is called when a suitable drag-gable element is dropped onto the drop target and the target accepts it. Syntax: Droppables.add('element', {onDrop: 'callbackFunction'} ); Values: function: This option takes 2 min read script.aculo.us Drag & Drop greedy Option This script.aculo.us Drag & Drop greedy Option is used to stops processing hovering other droppable, under the drag-gable won't be searched. The default value of this option is true, that means the drop area will accept the draggable element false won't. Syntax: Droppables.add('element', {greedy 2 min read Like