Drag drop and resize?

Hi, Can any of you supply me with some code of resizing a DIV tag and drag and drop on the screen.
Thanks. It is ok if it works just for IE?
Who is Participating?
COBOLdinosaurConnect With a Mentor Commented:
This might be a start on what you want.  Let me .  


<!-- text in a scrollable box
<title> Archive notes </title>
   .scrollBOX {height:150px;width:450px; border: 2x inset black;
               border-bottom: 1px solid silver;
               border-right: 2px inset silver; overflow:auto}
<SCRIPT language="JavaScript">
   var dragon=false;
   var fat=false;
   var tall=false;

   function dragEvnt()
      if (dragon)
         var WIN=window.event;
         var EL=document.all["hottab"].style;
   function doWidth(EL)
      EL.value=(fat) ? "wider" : "narrower";
      document.all["scroller"].style.width=(fat) ? 450 : 600;
      fat=(fat) ? false : true;

   function doHeight(EL)
      EL.value=(tall) ? "taller" : "shorter";
      document.all["scroller"].style.height=(tall) ? 150 : 350;
      tall=(tall) ? false : true;
<BODY onLoad="document.body.scrollTop=25000" onMouseMove="dragEvnt()">
<div id="hottab" STYLE="position:absolute;left:40;top:200">
<table border=0 width=450 cellspacing=0 cellpadding=0>
<tr height=25>
<td width=200 style="background-color:teal;color:white"
          align="center" valign="middle"
### drag bar ###
<td width=125 align="center"><input type="button" value="wider"
       name="fatbutton" onClick="doWidth(this)"></td>
<td width=125 align="center"><input type="button" value="taller"
       name="tallbutton" onClick="doHeight(this)"></td>
<DIV class="scrollBOX" id="scroller">  
This is a box full of text. The box can be positioned anywhere on the
page. The size can be set to any width and height, and with the addition  
of a small JavaScript control it could be dynamically sized by  the user.  
It can also be made dragable so the user could move it up to the top to the  
page if they wanted to, also with a little script.    
Now the bad news it is strictly IE5 only.  It may be possible with a lot
of scripting to get it to look like this in Netscrap, but I doubt it. The  
add on features can definitely not be done in Netscape.  Might be possible
in Netscape 6 with scripting changes to use DOM1 instead of the all collection.
There is total control of the fonts borders backgrounds etc using the style
<br /><br />
<font color="red"> Let me know if this helps, and we can set it up the
way you need it.  If you need to have it cross-browser --- SORRY!

Take a look at "Windowscript" here:


nesifaAuthor Commented:
That works for drag drop. Can you do resizing too. It is ok just for Just the way you resize a web window and the same shapes of cursors.

7 new features that'll make your work life better

It’s our mission to create a product that solves the huge challenges you face at work every day. In case you missed it, here are 7 delightful things we've added recently to monday to make it even more awesome.

The code at


has both resizing and drag and drop. Source code and everything is available at this link.
nesifaAuthor Commented:
Can you give me just a simple resize code. As cursor is over the border, resizing will take place the way we see everywhere in IE windows.

I care just for IE.

Thanks again.

Instead of posting a lot of code here, it's easier if you go to:


And copy the code from the text-area fields.

Do like this:

Create a new HTML-document.
Copy the content of the first textarea fields in between your <head> and </head> tag.
Copy the content of the next textarea field in between your <body> and </body> tag.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.