Say you implemented a popup. In order to make the popup disappear when the user clicks on some other area of the browser, you would have to capture the mouse events. So far so good. However, if the popup goes beyond the visible area, then the user would use the mouse to scroll using the scrollbars. Unfortunately, by the time the scrollbar is adjusted and the mouse button is lifted, it triggers a onmouseup event which will close the popup. One way to prevent this is, checking the source element of the event being HTML element. Something like if(source.nodeName == “HTML”) return; where source is the source of the event.
Category Archives: js/dhtml
DHTML, CSS and AJAX are all making people write more and more complex html code, ofcourse providing very good user experience. Dynamically displaying a UI control based on some user action can be achieved in two ways
1. By having the ui control pregenerated but hidden
2. By dynamically creating the dom necessary for the ui control and inserting it into the page’s dom.
Ofcourse, there may be cases where this can only happen on the client side. For example, to provide an ability to create any number of rows by clicking a “add another row” button, pregeneration of all the row regions before hand on the serverside is not feasible. So, that’s when the DOM manipulation on the client side will come handy.
So, unless you have this complexity, stick with pre-generating the UI elements on the serverside. You have a way to view the created HTML which makes it easy to debug.