Advanced Topics in JavaScript: Cookies to Dynamic HTML

1. Lectures on JavaScript II: Advanced Topics from Cookies to Dynamic HTML CIS 5930-04 Applications of Information Technology II Building the Distributed Object Web Spring Semester 2001 MWF 2:30 pm - 3:20 pm Instructors: Geoffrey Fox and Bryan Carpenter Dept. of Computer Science School of Computational Science and Information Technology 400 Dirac Science LibraryFlorida State UniversityTallahassee Florida 32306-4120 http://www.csit.fsu.edu fox@csit.fsu.edu 850-644-4587 dbc@csit.fsu.edu 850-644-0180 http://old-npac.csit.fsu.edu/users/gcf/javascriptIImarch99/addonsummary.html it2javascriptIIspring01

2. Outline of Advanced Topics • Actually these are Netscape activities – not properly done but a “pointer to the future” • Cookies are generally used • Cookies -- Store and Access information stored on client machines • JavaScript Security • LiveConnect -- Link Java and JavaScript • LiveWire -- Server Side ECMAScript • More advanced ways of defining, laying out and controlling web documents: • Where does Dynamic HTML fit in with world of XML CSS W3C DOM that we already discussed….. it2javascriptIIspring01

3. Introduction to Cookies • A cookie is operationally a relatively small named string stored by the browser and a property of the Document object • The cookie mechanism gives the browser a kind of memory, that is, a cookie “saves state” • Originally, only CGI scripts could read/write cookie strings, but with JavaScript, cookies can be handled entirely on the client side • A cookie • persists for the duration of the browser session (but an expiration date may be given) • is associated with the subtree of the document that created it (but a cookie path may be specified) • is accessible to pages on the server that created it (but a cookie domain may be declared) it2javascriptIIspring01

4. Cookies - "hidden" alternative • Cookies were introduced by Netscape to preserve client side state • If you have a CGI script that services several clients (ordering T Shirts perhaps), it is neatest to use client and not server to store information such as name of user, passwords etc. • Traditionally saved state in forms for a session preserved using "hidden" fields • <INPUT type=hidden" name="username" value="" > • set by formname.username.value = WHATHAVEYOU; • Such hidden fields are passed to CGI scripts in same fashion as other variables set in form text fields • hidden values can either by set by JavaScript on client side or returned built into a page constructed by CGI script which might read N values and return a new form with M new fields for client to fill in and N old entries preserved in hidden fields • So hidden variables are nice but only preserved as long as you keep to page you started with or that returned by CGI script. it2javascriptIIspring01

5. Cookies -- Client Side Files • Cookies provide an alternative mechanism to hidden files where information is saved in special file on client (called cookies or cookies.txt) • Note History Cache Bookmarks are also saved client side • Such files can preserve information in a more robust way than hidden alternative! • Cookies are supported by Microsoft and and Netscape and can be used (like forms) for pure client-side or client-server activities • Neither hidden or cookies are very secure • Cookies have 5 attributes -- name, expires, domain, path and secure and are specified by a single line that must specify a value for name but where all other attributes are optional. • http://www.npac.syr.edu/projects/tutorials/books/Netscape/OLC1.2/13-5.htm it2javascriptIIspring01

6. Specification of a cookie - I • name=value; EXPIRES=datevalue; DOMAIN=domainname; PATH=pathname; SECURE • name is required and tells you name of cookie • EXPIRES is optional but if present specifies a date after which cookie is to be deleted • EXPIRES uses a modification of syntax returned by JavaScript function Dateobject.toGMTString() • dayofweek, Day-Month-Year Hour:Min:Secs GMT • e.g. Wednesday 19-02-97 19:10:24 GMT • It appears that one can just use the slightly different syntax of toGMTString as well as “official format” • so now =new DATE(); now.setTime( now.getTime() + 24*60*60*1000); • now.toGMTString() will give an expiration date of one day from now! it2javascriptIIspring01

7. Specification of a cookie - II • DOMAIN defaults to domain of server where cookie set and general matching matching is done starting at end of domain • DOMAIN=npac.syr.edu matches all servers ending with these characters • PATH=/ is most general path and matches all paths but default is again path of document that set cookie. • Thus you must set PATH explicitly to / if you want cookie to be valid for a file stored in directory below that of setting document • SECURE if present requires a secure communication channel it2javascriptIIspring01

8. Use of Cookies in Server Program • The Brower passes to server any cookies that are valid for a given page in HTTP header • Note only name=value is passed because PATH DOMAIN SECURE and EXPIRES are used to check if cookie should be passed • The server stores cookie strings in $HTTP_COOKIE environment variable as name1=value1; name2=value2; • It is easy for CGI script to decode this $HTTP_COOKIE environment variable • One can send cookies back to client usingSet-cookie: name1=value1; expires= .. ; domain= ...; etc. before thecontent-type: text/html header line it2javascriptIIspring01

9. Use of Cookies in Client Program • JavaScript string object document.cookie holds cookies that are valid for this document and can be used to either set or retrieve cookie values • In examples I used to build of customized displays of sets of pages, we have pages with a form that sets values of parameters common to several pages and stores for a certain length of time. This is entirely processed client-side with JavaScript interpreting form and storing values in appropriate cookie entries • These cookies are read on other pages (consistent with PATH and DOMAIN) and if present used to define JavaScript variables that are used in "parameterized HTML” • Note document.cookie is set to a single cookie value but when read gives all cookies for this document! • Standard JavaScript routines including Cookie Libraryhttp://www.npac.syr.edu/users/gcf/forcps616javascript/WWutility.txt it2javascriptIIspring01

10. Cookies Limitations • A cookie string may not contain semicolons, commas, or whitespace (use escape() and unescape()) • There are some Size Limitations: • No more than 300 cookies per client • No more than 20 cookies per server • No more than 4Kb per cookie it2javascriptIIspring01

11. JavaScript Security • When browsing the Web, two pieces of information are considered public: the IP address of the client and the type of browser. All other data are considered private. In particular, • JavaScript does not permit access to the client file system • JavaScript can not establish a direct connection to an arbitrary Internet host • Unfortunately Netscape6 does not do Security, Netscape 4 and IE5 are very different it2javascriptIIspring01

12. Same Origin Policy • A tiresome feature appeared in NN2: • Scripts from one server may not read properties of windows or documents from another server • For example, a script from home.netscape.com may not read the properties of a document loaded from developer.netscape.com • This creates difficulty if JavaScript in “main page” and load a different file (from a different domain) into either another window or another frame of current window it2javascriptIIspring01

13. The domain Property • The document.domain property is initialized to the hostname of the server from which the document was loaded • This property may be set to any valid domain suffix of itself • For example, if document.domain is “home.netscape.com”, it may be set to “netscape.com” (but not “ape.com”) it2javascriptIIspring01

14. Data Tainting • Data tainting, an alternative to the Same Origin Policy, was experimentally implemented in NN3.0 • Data tainting allows access to private data (e.g., history[] array) but forbids “export” of this data over the Internet • Both data and methods may be tainted • In principle one could selectively control access but in practice it never worked as too hard to “untaint” • Tainting was extremely clumsy and has been disabled in NN4, in favor of signed scripts it2javascriptIIspring01

15. Signed Scripts • A new security model called signed scripts was implemented in NN4.0 • Signed scripts are based upon the Java security model for signed objects • The following objects may be signed: • inline scripts specified with the <SCRIPT> tag • separate source files given by the SRC attribute • event handlers • JavaScript entities it2javascriptIIspring01

16. Signed Scripts (cont’d) • Scripts are signed using Netscape’s Signing Tool (signtool), a command-line utility that creates digital signatures for Java class files, JavaScript scripts, plugins, etc. • Scripts may be served from a secure (SSL) server, in which case they’re treated as if signed with the public key of that server • Users retain the right to deny the privileges requested by the signed script • As in Java, you are asked whether to allow a given type of operation with an option to “remember this decision” it2javascriptIIspring01

17. Certificates • A certificate is an electronic document used to identify an individual or organization • An object-signing certificate is a special kind of certificate that allows you to associate your digital signature with one or more files • A digital signature is analogous to a handwritten signature (that is, it is difficult to refute and may be legally binding) • One gets a Software Developers Certificate from a company like VeriSign which one uses to sign “official CSIT” Java or JavaScript • VeriSign is meant to check we are reputable before giving us a certificate! it2javascriptIIspring01

18. JAR Files • Signed objects are packaged in a JAR (Java Archive) file, a sort of “digital envelope” based on the ZIP archive format • Using signtool, one associates digital signatures with the files in a JAR, which: • confirm the identity of the entity whose digital signature is associated with the JAR • check whether the files have been tampered with since being signed it2javascriptIIspring01

19. Using signtool • First check to see what object-signing certificates are available:% signtool -l • If none are available, a test certificate may be created with the command: % signtool -G MyTestCert • To sign scripts in directory “signdir”, type:% signtool -k MyTestCert -J signdir • So this is only DOS program I run on my PC! it2javascriptIIspring01

20. Writing Signed Scripts • First, identify inline scripts to be signed: <SCRIPT … ARCHIVE="some.jar" ID="1"> • The script ID must be unique in the JAR • JavaScript source files don’t need an ID: <SCRIPT … ARCHIVE="some.jar" SRC="file.js"> • Note: Only one ARCHIVE attribute per document is necessary, in which case all signed objects are stored in a single JAR it2javascriptIIspring01

21. Using Signed Scripts (cont’d) • Signed scripts may request expanded privileges • For example, to access private data: netscape.security.PrivilegeManager. enablePrivilege( "UniversalBrowserRead" ); • “UniversalBrowserRead” is just one of many target privileges that may be requested • "UniversalBrowserAccess” is read and write • "UniversalFileRead” allows reading of client files • Unsigned Scripts and Signed Scripts can NOT be mixed in same document • One access methods in signed scripts from unsigned scripts (in a different layer or window) as long as signed script exports method and using script imports it • export signedmethod; in window signedwindow • import signedwindow.signedmethod; in another window • Use as signedmethod(arguments); it2javascriptIIspring01

22. LiveConnect • LiveConnect is a Netscape communications protocol between Java applets, plugins, and JavaScript • A JavaObject is a JavaScript wrapper around a Java object; a JSObject is a Java wrapper around a JavaScript object • MSIE3.0 does not support LiveConnect; instead, applets are treated as ActiveX objects, but fortunately the basic syntax is the similar it2javascriptIIspring01

23. LiveConnect (cont’d) • With LiveConnect: • JavaScript can access the classes of the browser’s Java virtual machine • e.g. java.lang.System.out.println(“A string”); // writes to Java Console • JavaScript can read/write the public variables of an applet and invoke public methods; same for Java-enabled plug-ins • Applets and Java-enabled plug-ins can read/write JavaScript object properties and invoke JavaScript functions it2javascriptIIspring01

24. LiveConnect Examples • http://www.npac.syr.edu/projects/tutorials/JavaScript/examples/advanced/LiveConnect.html • http://www.npac.syr.edu/projects/tutorials/books/Netscape/OLC1.2/13-7.htm • http://www.npac.syr.edu/projects/tutorials/books/Netscape/OLC1.2/13-8.htm • http://www.npac.syr.edu/projects/tutorials/JavaScript/examples/advanced/LiveConnect1.html it2javascriptIIspring01

25. LiveWire • LiveWire is Netscape’s proprietary alternative to CGI, which lets developers create database applications in JavaScript (ECMAScript) • It consists of two components: a compiler and a server extension (both require Netscape’s Enterprise Server) it2javascriptIIspring01

26. LiveWire (cont’d) • Server-side JavaScript is used to connect to and interact with a database server • A server-side object called DbPool lets you (efficiently) connect to multiple databases or multiple times to a single database • Client-side JavaScript is contained in <SCRIPT> tags; server-side JavaScript is contained in <SERVER> tags and must be pre-compiled on the server it2javascriptIIspring01

27. Dynamic HTMLHypertext Markup Language it2javascriptIIspring01

28. What is DHTML? • Dynamic HTML : The Definitive Reference by Danny Goodman, O'Reilly & Associates; ISBN: 1565924940, August 1998 (4.5 star, #1190 Amazon) • http://www.oreilly.com/catalog/dhtmlref/ • DHTML = Dynamic HTML • Capabilities of DHTML: • dynamic styles — change the appearance (that is, presentation) of content on-the-fly • dynamic content — change the content itself on-the-fly • dynamic positioning — position page elements (such as images or text) on-the-fly it2javascriptIIspring01

29. Features of DHTML • It is available now albeit in different versions for different browsers • It is an extension of HTML and therefore familiar • It addresses many of HTML’s shortcomings • It is focussed at “visual display” of a document and so is orthogonal to XML • DHTML is a prototype of what W3C DOM support of XHTML, SVG etc. should give when browsers implement! • The new “document object model” is much more precise than old one in NN4 or IE5 it2javascriptIIspring01

30. HTML HTML HTML Database or Web Site or XML File Architecture of DHTML + XML HTML4 or XML+HTML4 or XHTML Browser • 3 Scenarios User Interacts with HTMLChangingDynamicallyClient Side(JavaScriptcatches mouse and keyboard events and interprets as changed DOMcomponents: Browser renders) HTML HTML XML HTML ServerwithXMLParser Some XMLand some HTML XML it2javascriptIIspring01

31. Components of DHTML • DHTML consists of the following: 1) HTML 4.0 2) Cascading Style Sheets (CSS) to attach dynamic properties to document components 3) Document Object Model (DOM) describing and identifying components of a document 4) Scripts (in JavaScript) able to change properties of document components and so implement dynamic structure it2javascriptIIspring01

32. Cascading Style Sheets • http://www.w3.org/Style/CSS/ is general link • Cascading Style Sheets (CSS1) allow more precise and consistent layout than previous HTML attributes such as <FONT> • http://www.w3.org/TR/REC-CSS1 • Style sheets permit pages to inherit properties from other pages—in effect, they permit object-oriented document structure • CSS2 was released in May 98, and includes support for media-specific style sheets (e.g. printers and aural devices), downloadable fonts, element positioning and tables. • Aural rendering of web documents is needed for example with sight-impaired users, in-car applications, and language instruction • http://www.w3.org/TR/REC-CSS2/ • Cascading Style Sheets Positioning (CSSP) is early “positioning proposal” which can be added to CSS1 before CSS2 implemented it2javascriptIIspring01

33. CSS1 (and CSS2) Features • CSS1 allows one to specify layout styles (size, color, position) and associate in flexible way with tags • Flexible placement of style information -- either in sheets (i.e. separate pages), attributes (style=“..”) or style statements in header of HTML page • Independence from specific scripting languages but natural link to JavaScript • Cascading style sheets i.e. one can have a hierarchy of style definitions from general to organization specific to user specific • allows good defaults with optional customization • Compact and so sensitive to network performance concerns • Maintainable as isolates style information • Works with XML and HTML it2javascriptIIspring01

34. Specification of Styles: External • A simple style sheet (in file “myStyle.css”): P.special { color: red; border: solid black; } • Now put a <LINK> tag in the <HEAD>: <LINK href=”myStyle.css” rel="stylesheet" type="text/css"> • In the <BODY>, type:<P class="special">A special paragraph! it2javascriptIIspring01

35. Embedded Styles • Read in a style sheet and override a style: <HEAD> <STYLE type="text/css"> @import url(myStyle.css); H1 {text-align: center} </STYLE> </HEAD> • Color a paragraph (not recommended): <P STYLE="color: green">A green paragraph! Selector Declaration it2javascriptIIspring01

36. A Larger CSS Example • <HTML> <HEAD> <TITLE>title</TITLE> • <LINK REL=STYLESHEET TYPE="text/css" HREF="http://style.com/cool.css" TITLE="Cool"> • <STYLE TYPE="text/css"> • @import url(http://style.com/basic.css); • H1 { color: blue } • H2.vivid {color:pink} • #myid {position:absolute; color:red; top:20; left:50; background-color:red; visibility:hidden} • </STYLE></HEAD><BODY> • <H1>Headline is blue</H1> • <P STYLE="color: green">While the paragraph is green. • <h2 class=vivid>And the secondary heading is Vivid</h2> • <div id=myid> • <h2>Default Color Positionable element</h2> • </div> • </BODY> </HTML> it2javascriptIIspring01

37. Document Object Model • W3C DOM (http://www.w3.org/DOM/ ) defines a platform-independent programmatic interface to web documents: • provides access to structured data • adds object orientation to page layout and design (HTML elements are objects with properties and methods) • is implemented with a scripting language • defines event model (not in level 1 DOM) • defines a way of navigating through component objects in a web page • Initially, DOM is bound to ECMAScript but is language neutral in design • Current Browsers implicitly define a DOM which is somewhat different between Microsoft and Netscape and between versions 4 and 5 it2javascriptIIspring01

38. Hierarchical Object Components in a Web Page • Here is an example of a source document encoded in HTML: • <HTML> • <TITLE>My home page</TITLE> • <BODY> • <H1>My home page</H1> • <P>Welcome to my home page! Let me tell you about my favorite composers: • <UL> • <LI> Elvis Costello • <LI> Johannes Brahms • <LI> Georges Brassens • </UL> • </BODY> • </HTML> Component Objects in Web Page it2javascriptIIspring01

39. Use of Position Attributes in JavaScript • Making dynamic pages with HTML and JavaScript requires two types of capabilities. • Identifying events of interest (the user interactions that will trigger dynamic structure) and processing • Dividing page up into identifiable components where we can separately: • move around in x,y position • move up and down a stack of pages (decide what's on top) • change content and style of components • These capabilities EXIST in current browsers but are incomplete and different • More powerful “standards” are part of W3C DOM1 and DOM2 and presumably these will be adopted • In the meantime we adopt strategy which is supported by current browsers and can evolve to W3C DOM1,2 it2javascriptIIspring01

40. 0 1 5 4 3 2 DHTML 1) Define Layers -- I • The first step is to define different named entities in document. • The picture shows 6 entities labeled 0 1 2 3 4 5 • 0 is main window • Others subsidiary windows 1->5 • 4 is layered above 3 and 5 • There could be other hidden named entities -- either because they had CSS-P visibility attribute set to hidden or because they were completely underneath other named windows • Entities could either be scattered around --seemingly at random or aligned precisely w.r.t.other positionable parts of document it2javascriptIIspring01

41. DHTML 1) Define Layers -- II • The position CSSP attribute takes values static (default) relative (position relative to where it “should be” in current “context”) and absolute (position in current “context”) • These are properties of essentially ALL document components in the ”DOM of our dreams” • However in today's pragmatic world, one can only use for some HTML tags • <DIV> and <SPAN> (<<---- USE THESE!) are supported today by Microsoft and Netscape and are part of HTML4 • <LAYER> is best “name” (so lets call them layers)and fully supported by Netscape; it is not part of HTML4 and not supported by Microsoft • <IFRAME> (internal frame) is not in Netscape4 but is in HTML4 and supported by Microsoft it2javascriptIIspring01

42. DHTML -- Decide on Browser • // Set Flags to determine which browser is which • WW_Netscape4 = true; • WW_Microsoft = false; • WW_oldbrowser = false; • WW_setbrowser(); • function WW_setbrowser(){ // Set Browser Flags • if( navigator.appName != "Netscape" ) { • WW_Netscape4 = false; • WW_Microsoft = true; } • if( navigator.appVersion < 4 ) { • WW_Netscape4 = false; • WW_Microsoft = false; • WW_oldbrowser = true; } • } // End WW_setbrowser() • http://www.npac.syr.edu/users/gcf/forcps616javascript/WWdhtmlutility.txt it2javascriptIIspring01

43. Define a Layer in a Document using <div></div> Style • <style type="text/css" > • #WWmessage1 {position:absolute; color:black; visibility:visible; left:200; top:450; } • </style> • </head> • <body onload="WW_pageisloaded();" > • <h1>This is Page for CPS616 DHTML</h1> • …. See links below for full material (a form to specify layer properties) ….. • <div id="WWmessage1" > • This is a Moving Block of Text<br> • Input (left,top etc.) and see! • </div> • http://www.npac.syr.edu/users/gcf/forcps616javascript/classdhmtlexample1.html • http://www.npac.syr.edu/users/gcf/forcps616javascript/classdhmtlexample1.txt Good Practice for all processing which requires that page elements be fully defined } A movable layer it2javascriptIIspring01

44. Set Positions of a Layer in DHTML • function WW_getlayer(idstring) { // Find layer with given label • if( WW_Netscape4 ) { • return eval("document." + idstring); } • else { // Microsoft • return eval("document.all." + idstring); } • } // End WW_getlayer() • function WW_layershiftto(obj,x,y) { // Move layer to given position • if(WW_Netscape4 ) { • obj.moveTo(x,y); } • else { // Microsoft • obj.style.pixelLeft = x; • obj.style.pixelTop = y; } • } // End WW_layershiftto(obj,x,y) • WW_messageobject = WW_getlayer('WWmessage1'); • WW_layershiftto(WW_messageobject,parseInt(x),parseInt(y)); Returned by WW_getlayer id attribute in <div>#WWmessage1 in STYLE Read in from form as text it2javascriptIIspring01

45. Set Other Properties of a Layer in DHTML • WW_setbackgroundcolor(WW_messageobject,cc); • function WW_setbackgroundcolor(obj,actualcolor) { • if( WW_Netscape4 ) { • obj.bgColor = actualcolor; } • else { • obj.style.backgroundColor = actualcolor; } • return; • } // End WW_setbackgroundcolor(obj,actualcolor) • WW_layertogeneric(WW_messageobject,75) // Set stacking index to 75 • // At any point of window, object with largest stacking(z) index is shown • function WW_layertogeneric(obj,stackingindex) { • if(WW_Netscape4 ) { • obj.zIndex = stackingindex; } • else { • obj.style.zIndex = stackingindex; } • } // End WW_layertogeneric(obj) ASCII string such as “pink”setting dynamically object background color One can separately choose to hide layer or make it visible it2javascriptIIspring01

46. Changing Content of a DHTML Layer • function processbutton3() { // Process content from form text field • var inputstuff = WW_formlayer.document.classtest.textchoice.value; • if(WW_Netscape4) { // Netscape • WW_messageobject.document.open(); • WW_messageobject.document.writeln(inputstuff); • WW_messageobject.document.close(); } • else { // Microsoft is much more elegant • WW_messageobject.innerHTML = inputstuff; • WW_messageobject.style.width = 300; } • // Seemingly Netscape clips text layer to width of text; Microsoft to width of window; both clip vertical height to that of text; this is typical difference between • today’s erratic implementations of DHTML • WW_layertotop(WW_messageobject); // Set layer zindex to 1000 • WW_layershow(WW_messageobject); // Make layer visible • return; • } // End processbutton3() Note in Netscape full address is window.document.layer.document.property it2javascriptIIspring01

47. Capturing Events in Today’s DHTML • function WW_pageisloaded() { // Initialize when page loaded • if(WW_oldbrowser) • return; • if( WW_Netscape4 ) { // Netscape • window.captureEvents(Event.CLICK); • window.onclick=WW_processclick; } • else { // Microsoft • document.onclick=WW_processclick; } • WW_pointerlayer = WW_getlayer('WWpointerblock'); // Pointer • WW_pointerlayer.onmouseover = WW_overpointerblock; // Mouse Over • WW_pointerlayer.onmouseout = WW_offpointerblock; // Mouse Out • WW_pointermessageobject = WW_getlayer('WWpointermessage'); • if(!WW_Netscape4 ) { // Microsoft set layer width • WW_pointermessageobject.style.width =200; • WW_pointerlayer.style.width=64; } • return; • } // End WW_pageisloaded() • Full link on later page Capture ALL Clickevents and set handler Set event handlersfor mouse events captured in conventional way it2javascriptIIspring01

48. A User Event Handler in DHTML • function WW_processclick(e) { // Process Mouse Click • var clickX = WW_eventx(e); // Extract Mouse Click Position • var clickY = WW_eventy(e); • // Position Top right of pointer at mouse click • var width = WW_getlayerwidth(WW_pointerlayer); • WW_layershiftto(WW_pointerlayer,clickX-width,clickY); • WW_layershow(WW_pointerlayer); // Make pointer visible • WW_layertotop(WW_pointerlayer); // set zindex=1000 • WW_offpointerblock(); // remove stray mouseover messages • window.status = 'click'; // flag action • // true implies that you continue conventional processing i.e. • return true; // that clicks on links are recognized • } // End WW_processclick(e) it2javascriptIIspring01

49. Event Processing Models • In Netscape, the event is passed as an argument to the handler as in WW_processclick(e) • While in Microsoft IE, event properties are stored in a single window property window.event • So in WW_eventx(e), the argument is ignored in IE • function WW_eventx(e) { // return x value of event • if(WW_Netscape4 ) { • return e.pageX; } // Netscape • else { return window.event.clientX; } // Microsoft • } // End WW_eventx(e) • http://www.npac.syr.edu/users/gcf/forcps616javascript/WWdhtmlutility.txt • http://www.npac.syr.edu/users/gcf/forcps616javascript/classdhmtlexample2.html • http://www.npac.syr.edu/users/gcf/forcps616javascript/classdhmtlexample2.txt it2javascriptIIspring01

50. Everywhere HTML • A wysiwyg HTML editor called NetObjects Fusion generates dynamic web pages in “Everywhere HTML” • By using a combination of HTML, CSS-positioning and JavaScript, pages written in Everywhere HTML work properly on both Internet Explorer 4.0 and Communicator 4.0 (or so it is claimed) • However pages are not portable to other authoring systems and require you to stick with this tool • Produced HTML ugly and tool specific • Dreamweaver has similar capabilities it2javascriptIIspring01