Attempting to replicate this:
This is what I have for the draggable element:
$( function() {
$('#sidebar .question-constructor').draggable({
connectToSortable:'#preview',
scroll: false,
helper : 'clone',
cursorAt: { top: 56, left: 200 }
});
});
and my div:
<div class="question-constructor" style="border-style:solid; border-width:5px;">
<label for="textbox" style="display: inline-block;" >Question: </label>
<input id="textbox" type="text" />
</div>
My current result looks like this:
I'm not quite achieving my desired outcome yet. However, at the moment, I want to learn how to add a shadow to the clone of the draggable element similar to my target image.
UPDATE:
I attempted using this code snippet:
$('.question-constructor').animate({ boxShadow : "0 0 5px 3px rgba(100,100,200,0.4)" });I placed it outside the draggable selector but it's still not producing the desired effect.