Drag div to another div and resize on drop!

Question

Good night, you guys! Basically what I’m trying to do is drag a div (#mainmsg) into another div (#msgprivhere), but I need it resized when I drop it. I would just like to know if this is possible. I am starting in the area of web development, and I am very lay. I thank you already! I have no preference for language no. If there is a possibility, I would like to try. I thank anyone who can answer!

                <div id="scroll" >
                    <div id="hidden">
                        <div class="rcvmsg" id="mainchat">
                            <div class="mainmsg">
                                <span class="nickname"> Oliver Motokh </span>
                                <span style="float:right"> 12:34 pm </span>
                                <span> heeooooyuuuo</span>
                            </div>
                        </div>
                    </div>
                    <div id="msgprivhere">
                        <div class="privmss">
                            <div id="rcvprivuser">
                                <div id="privuser">
                                    <span class="nicknamepriv">Oliver Motokh </span>
                                    <span style="float:right"> 12:34 pm </span>
                                    <span> heeeeyyyyyyooooooooooooy</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

Answer 1

Hello. You can use the function onDrop javascript:

 <div ondrop="Funcao(evento)"></div>

In the function you resize using jQuery, manipulating the css of the div.
I hope I’ve helped.

** Updating As requested, I’m putting together a more complete example of how to do this, using jQuery:

In HTML:

<div id="movimento" ondrop="mover()"></div>

In Javascript:

function mover() {
   $("#movimento").css({"width":"500px","height":"400px"});
}