Building `Drag-and-Drop` DIVs: Polishing the Look and Feel
(Page 1 of 5 )
This is the last tutorial of the series “Building drag-and-drop DIVs.” Welcome back. In three parts, this series introduces the key points for creating dragging DIV elements, for quick inclusion in web pages, emulating the behavior of many user interfaces found in current desktop applications.
As you probably know, in the previous article I demonstrated how to build realistic dragging DIVS, with only minor hassles, by using the powerful DHTML capabilities of Michael Foster’s X library. Trust me. This set of source files will make your life a lot easier, particularly if you often find yourself developing JavaScript applications that require writing complex routines for implementing cross-browser presentation and behavior layers. Whether you’re building simple DHTML effects or sophisticated AJAX-based applications, this library will be a real time saver for your client-side programming requirements.
Now, before proceeding further, let’s recapitulate the topics I explored in the second part of this series, so it will be easier going through this last tutorial. As you’ll remember from my previous installment, I developed some examples for creating dragging DIV elements. I started from a simple script, which originally displayed one DIV box, then moved to a subtly more complex example, where multiple dragging DIVs were included on the same web document.
However, until now I focused my attention on explaining the programming logic implemented in the hands-on examples, and deliberately left out any direct reference to improving the look and feel of the dragging DIVs. This probably seems like a trivial thing -– after all, you might be wondering, why not just concentrate on creating drag-and-drop DIVs, and forget all the stuff related to presentation? There’s a good reason for this. Since the process for building dragging DIV boxes has been grasped already, adding a window-like appearance to the DIVs would be definitely a good enhancement.
So, considering that polishing the look and feel of dragging DIVs can be a fun and instructive experience, that’s what I’m going to do over the course of this article. Are you interested in learning how this will be done? All right, let’s get started.
Next: Adding elements on the fly: building DIV elements with the DOM >>
More JavaScript Articles
More By Alejandro Gervasio