Articles and tutorials regarding DHTML http://www.troobloo.com/tech/dhtml.shtml en-us http://www.htmlcenter.com/tutorials/tutorials.cfm?ID=116&type=dhtml ? What is dHTML? Tutorial Tutorial Written By: David Gardner What is DHTML? That's a great question, one that I admit I had a lot of trouble finding a straight answer to. I remember seeing a posting on a JavaScript newsgroup that attempted to answer this question with the reply: "DHTML is the combination of HTML and JavaScript" I said to myself "Isn't that just a webpage with JavaScript on it then?" I was confused, to say the least. After shuffling through hundreds of search results on... http://www.htmlcenter.com/tutorials/tutorials.cfm?id=118&type=dhtml Tutorial Written By: David Gardner DHTML in IE 4 As I began taking on and learning IE 4's implementation of DHTML, and realized that there's a lot more to it than its NS counterpart. DHTML in IE does not rely on any one tag, but rather, new objects and properties that stem out of the usual HTML tags you're used to working with, such as <div> and <table>. It's a lot more powerful, but at the same time, a lot more complicated to grasp. -The style object of IE 4 HTML elements in IE 4 now... http://www.htmlcenter.com/tutorials/tutorials.cfm?id=115&type=dhtml Tutorial Written By: David Gardner Beginner's Guide to DHTML This tutorial is written and contributed by Davud Gardner. Please refer to footnote for more info. As a self-proclaimed webmaster, I try my best to keep up with the latest in web technology. My current endeavor is DHTML, or Dynamic HTML. After hearing a lot about this technology and how it will eventually revolutionize the internet, I thought I had to get off the couch and start learning about it, before I lose the right to... http://www.htmlcenter.com/tutorials/tutorials.cfm?id=121&type=dhtml Tutorial Written By: David Gardner Creating cross-browser DHTML Before "true" cross-browser DHTML becomes available (in other words, when NS and IE comes to their senses), cross-browser DHTML basically means using various scripting techniques you picked during those JavaScript years to sniff out which browser the user is using, and execute the code intended for that browser. In this lesson, I'll first illustrate a way of creating a "cross-browser" layer, then show you a scripting... http://www.devarticles.com/c/a/DHTML/Cross-Fading-Navigation-with-DHTML/ ( Page 1 of 5 ) Need to build smooth and attractive fading techniques into your web site using nothing more than script? This article will explain a proven cross-browser method, with ready-to-use code. If you think you don t need this, you will conclude otherwise after reading the article! If you ve perused the recently re-launched Macromedia website, you ve witnessed their smooth and sexy navigation component built in Flash. If you haven t seen it yet, basically I m talking about an... http://www.htmlcenter.com/tutorials/tutorials.cfm?id=117&type=dhtml Tutorial Written By: David Gardner DHTML in NS 4 - The <LAYER> tag This could either be a good thing, or a bad one, depending on your view. DHTML in NS 4 is quite simple, and comes down to essentially one word- Layer. I was pretty astonished myself, but its true- NS 4 relies completely on a new tag, called the <LAYER> tag, to spin up its DHTML magic. This new tag is dynamic in that it can be positioned anywhere on a web page (without relation to other content), moved around, its content... http://www.devarticles.com/c/a/DHTML/YADM-Yet-Another-Dynamic-Menu/ ( Page 1 of 4 ) YADM is an accessible DHTML dropdown/flyout/explorer solution with complete separation of CSS and JavaScript. YADM was developed to help you create navigations that make sense, not to create whizz-bang navigations that are there for the sake of being flashy. Dropdown navigations still seem to be cool and are part of almost every screen design these days. The fact that they cause a lot of accessibility and usability issues seems not to transpire, and clients keep asking... http://www.eggheadcafe.com/articles/20021022.asp By Robbe D. Morris Printer Friendly Version Purple keywords indicate links to related content. As with most of my articles, the DHTML Sortable Grid Control stems from a request here at work to create a 100% client side JavaScript solution for a cross-browser based sortable grid. The idea being that the user would not have to wait for a page reload each time the sort was adjusted or process another query on the server. To provide further complexity, the ability to include certain form... http://www.htmlcenter.com/tutorials/tutorials.cfm?id=119&type=dhtml Tutorial Written By: David Gardner Dynamic content If you're not yet scared off by all the differences in syntax and functionality between DHTML in NS 4 and IE 4, you're ready to learn how to make content on your page dynamic, or change on demand! - Dynamic content in NS 4 Changing content in NS 4 involves- you guessed it- the layer tag. All layers are treated by the NS browser as a separate entity from the rest of the page, with their own document object (which in turn contains other... http://www.htmlcenter.com/tutorials/tutorials.cfm?id=120&type=dhtml Tutorial Written By: David Gardner Moving elements around in the document If you like working with animations, you'll be glad to know that with DHTML, the entire web page is now your drawing board! You can create content that fly all over the screen freely. In Netscape, this is done by manipulating the left and top attributes of the <layer> tag. In IE 4, the same thing is accomplished by altering the pixelLeft and pixelTop properties of the style object. -Moving elements in NS 4 Recall... http://www.intranetjournal.com/articles/200008/domindex.html By Aaron Weiss Introduction A DOM for all Seasons Simple Hybrids Meta DHTML Part I: Syntax Patching Meta DHTML Part II: Function Libraries Square One/Resources A consequence of the tense push-pull between common standards and proprietary advantage is that Web developers today are faced with two co-dominant, partially incompatible development environments; operating systems of a sort: Microsoft's Internet Explorer and Netscape's Navigator. In order to excite users of either browser you,... http://www.devarticles.com/c/a/DHTML/Dynamically-Positioned-Layers-by-Mouse-Position/ ( Page 1 of 3 ) One method of providing additional options to users is to present a menu that displays itself when necessary, such as when users click or just hover over an item. This article explains how to produce such a DHTML menu, which dynamically positions itself where the user s mouse is. There are many situations where user experience can be improved on a website by using dynamic menus. These can be created and used in a variety of ways, but I m going to use a layer or <div>... http://www.devarticles.com/c/a/DHTML/Cross-browser-Functionality-with-Branching/ ( Page 1 of 3 ) There are several methods of ensuring cross-browser functionality with at the major browser vendors. Explore what the userAgent object can do. Included are code samples for determing what browsers visitors to your sites are using. The invention of DHTML has led to a proliferation of easily coded, impressive web pages containing animation and client-side effects. DHTML is easily learnt by building upon a foundation of previously acquired HTML knowledge and it's easily... http://www.devarticles.com/c/a/HTML/DHTML-Form-Enhancement/ ( Page 1 of 5 ) There are few tools to speed up form development. This article illustrates simple ways to provide some basic enhancements to your web application's forms such as validation, automatic submission, and hilighting of the field in focus. Introduction Something that all of us have done once if not a thousand times is website form processing. For those of us who prefer not to use .NET generated JScript for our forms, there are few tools available to speed up form development.... http://www.eggheadcafe.com/articles/20020922.asp By Robbe D. Morris Printer Friendly Version Purple keywords indicate links to related content. Recently, I was asked to create a custom slider control for a web based research tool accessed by visitors using Internet Explorer 5.5 and above. The control needed to be 100% client side in order to support custom UI characteristics not included in this code sample. This particular control also needed to support two types of slider math options: Percent Range and Score (1-9) Range. The... http://www.developer.com/dhtml/article.php/640801 By Joe Burns Go to page: 1 2 Next So. Do you like my scrollbar? I've found that most users don't like scrollbars all that much. Most would rather click and go from page to page, but scrollbars are part of the Web and differing screen sizes make it nil to impossible to never attain a scroll bar. I ran across only one of these CSS commands while surfing my University's Web site . The Webmaster had placed them on the homepage to get a nice green scroll. That's one of the school's colors. I... http://www.developer.com/dhtml/article.php/640281 By Jerry Honeycutt You can group the font properties using font . You specify the weight, style, size, and family, as in the following example: font: bold normal 12pt times, serif font-family font-family is a prioritized list of typefaces for the element. You can specify a single typeface or a list of alternatives, separated by commas, as in the following example: font-family: Courier, Times, Serif You can use a font name you expect to be on the user's computer, such as Courier or... http://www.developer.com/dhtml/article.php/966051 This article was contributed by /A>. Environment: IE 4.0 and above Function Name : "CheckNumeric()" This Javascript function prevents a user from being able to enter non-numeric data into a text field in an HTML form. When a user types data into a text field that uses this function, only numeric characters which are typed actually appear in the field. Any other characters are ignored and do not appear. It is a useful tool if you're looking for a simple way to ensure you have numeric... http://www.developer.com/dhtml/article.php/976351 By Bradley L. Jones The following is an editorial by Bradley L. Jones for www.CodeGuru.com . While .NET from Microsoft is only one part of the coding world, it has been center stage the last few weeks and months. As of last week, .NET is finally a released product that is now commercially available. Microsoft likens the .NET technology as a revolution in software development equivalent to the introduction of the PC and the introduction of the graphical user interface (GUI). Like many... http://www.developer.com/dhtml/article.php/1014741 By Earthweb Staff April 23, 2002 -- IBM today announced new WebSphere Studio application development products for Linux and Web-site development, as well as new toolkits for building wireless, portal, and voice applications. They are all based on the Eclipse platform, which is supported by an open-source community for multi-vendor software tool integration. Using Eclipse-based tools, developers can integrate tasks easily and quickly to improve the quality of applications and time to... http://www.htmlcenter.com/tutorials/tutorials.cfm?id=151&type=DHTML Tutorial Written By: Chad Jones The W3C is here to stay. The programmer that continues to rely on proprietary coding methods runs a serious risk of alienating a certain number of his or her viewer's. A perfect example is trying to view a "Layer" embedded web page on Netscape 6.1. Netscape completely abandoned the Layer tag in favor of a W3C DOM (Document Object Model). Internet Explorer "6" is doing it's part also in adopting the recommendations of the W3C standards. Will code branching... http://www.devarticles.com/c/a/JavaScript/Special-Effects-with-DHTML-Rollovers/ ( Page 1 of 4 ) It s common knowledge that JavaScript image rollover scripts became very popular in the early days of the Internet. While some people feel rollover effects have become perhaps, cliché, there are many ways to build upon simple rollover effects using JavaScript and style sheets. For the purpose of this tutorial, we ll focus on several effects and the basics of how to set up images for creating rollover special effects with DHTML. To jumpstart some ideas about image special... http://www.c-sharpcorner.com/Code/2003/Sept/ActiveXDHTMLProsCons.asp Submitted By User Level Date of Submission Rajesh Krishnamurthy Intermediate 09/16/2003 Introduction: This document shows a Comparison study of web pages using simple ASP and Pages using ActiveX Controls. By the End of this document, we arrive at a conclusion of using the better Technology. What is an ActiveX? If you use a Computer, Microsoft s ActiveX is probably part of your life. The ActiveX technologies have become an essential part of Microsoft applications and tools; they are... http://www.15seconds.com/issue/010823.htm By Eric Coffman Rating: 4.3 out of 5 Rate this article email this article to a colleague Introduction Ty Button's 15 Seconds article " Creating a PDF with ASP " does a good job of explaining the installation of the FDF Toolkit ActiveX version on your server and using the methods of the FDFApp object. Rather than repeat what has already been covered, I will just explain the handling of the most common form elements within a PDF Forms file and demonstrate the handling of a Forms Data... http://www.15seconds.com/issue/010824.htm By Eric Coffman Rating: 4 out of 5 Rate this article email this article to a colleague Introduction Let's say that you can't guarantee that your clients or users have Adobe Acrobat Reader installed or you don't want to spend $250 - $300 for the full version of Adobe Acrobat. However, you want to present a pleasant-looking form (perhaps matching you site's color scheme or style) that can be printed out without all those silly-looking text-box borders and drop-down arrows, etc. Sure, you... http://www.15seconds.com/issue/010822.htm By Eric Coffman Rating: 3.9 out of 5 Rate this article email this article to a colleague Introduction Forms have long been and will continue to be a central part of any interactive site. Collecting information from a form has been solved, first by posting the data to an e-mail address, then by using Common Gateway Interface (CGI) scripts, and currently by using other server-side technologies, such as ASPs. Collecting and storing this data into a database is a fairly simple process and... http://www.devarticles.com/c/a/HTML/How-to-Create-a-Dynamic-HTML-Navigation-Page/ ( Page 1 of 6 ) Learn how to devote an entire page to an image-driven, DHTML navigation system. This code from Dan Wellman will result in a fully functioning, interactive navigation page that loads a new page whenever a specified location of the window is passed over by the central image. Dynamic HTML, as the name suggests, was brought about to enable developers to produce text and graphics that are not static and fixed in position. The possibilities this brings to Web design are... http://www.eggheadcafe.com/articles/20030605.asp By Peter A. Bromberg, Ph.D. Printer - Friendly Version If you haven't followed the evolution of my DHTML Dropdown XML/XSL menu in its first incarnation as an ASCX User Control, you may wish to view that in my first article here . After completing the menu as a User Control, I decided to put in a little extra time and create a full-fledged ServerControl from it. To summarize, what I did with the original is take the "guts" of the old MSDN - style menubar with the drop-down menu lists,... http://www.webdevelopersjournal.com/articles/cascading/cascade_explained1.html by Aaron Prenot This article follows on from Cascading Menus and fully explains how the JavaScript in that menu program works. It's also a crash course in Dynamic HTML (DHTML), and to understand it you will need to know basic JavaScript. August 16, 2000 You can refer to the full JavaScript code for HMenu.js at any time through this link . The Script Let's recap on the elements dealt with in Cascading Menus . A menu is made up of four basic items - the menu itself, menu items , submenu... http://www.oreillynet.com/pub/a/onjava/newsletters/20030227.html by chromatic ONJava Newsletter for 02/27/2003 Dear Readers, Welcome back to another lazy Thursday afternoon. Kick back in your chair, pull up a lemonade, and enjoy two new articles we have for you this week. The notion of Rich Internet Applications has been kicking around for a while. Let's face it--a web applications with an HTML or even a DHTML UI doesn't quite cut it for replacing a native application. Java applets may not be the solution either. If you're feeling pragmatic, why not... http://www.devarticles.com/c/a/JavaScript/Switching-on-Layers-with-Scripts/ ( Page 1 of 5 ) This illustrates how to show visitors to a site which tab they are currently on. The article outlines how to create a script that manipulates the z-indices of graphical tabs to pull the one that is clicked to the top layer and show the content in that tab. There is a simple introduction to the div tag, the z-index property and DHTML scripting in general. Switching on Layers with Scripts and the <div> Tag Using web pages to display information is very easy; after all,... http://www.asp101.com/articles/matt/asperrordialogbox/default.asp by Matt Rutledge Have you ever needed some custom error handling for your asp site. I found that we had a need for it at my office, so I came up with a class that uses VBScripts Error handling object. The error class, CError, allows you to display a custom dialog box with the option to have a detailed message, a general message, and log the error in a file for later reference. It also uses some JavaScript and DHTML to allow the user to drag the dialog box around. But since this article... http://www.devarticles.com/c/a/JavaScript/Advanced-JavaScript-with-Internet-Explorer-Working-with-Drives-and-More/ (Page 1 of 6 ) This series mainly concentrates on retrieving system information using JavaScript and displaying the same on a web page. All of the examples in this series can be directly tested by copying and pasting the entire code (of each section) in any text file with the extension .HTM and opening it using Microsoft Internet Explorer (preferably 5.5+). In general, JavaScript is used mainly for web designing, DHTML and other interactive forms. Not everyone knows that we can use... http://www.xml.com/pub/a/2003/03/26/qa.html by John E. Simpson March 26, 2003 It's been a slow month on the O'Reilly Network XML Forum : it's not easy to write a column answering questions when none have been asked. So, it's time to dig into the archives, pulling out -- this time -- a couple of queries about processing XML. Q: Can I process my XML with JavaScript? For client-side work, is XML scriptable with JavaScript? In other words, can you get something analogous to DHTML with it? A: On the face of it, this question may seem... http://hotwired.lycos.com/webmonkey/01/12/index1a.html?tw=authoring 2 Displaying the Toolbar in Internet Explorer 3 Hacking Netscape 4 4 All Together Now 5 Adding the Nifty Stuff Building the (New) Webmonkey Toolbar by Taylor 20 Mar 2001 Taylor is a Webmonkey contributing editor and a mild-mannered technologist who freelances for Web design firms across the Net. Even though he's never been photographed or seen with Captain Cursor , he insists that they are indeed two separate people. Page 1 When the first DHTML toolbar was used on Webmonkey, part of its... http://www.devarticles.com/c/a/JavaScript/Building-DragandDrop-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...