Archive for January, 2008

« Previous Entries
Next Entries »

Web domain - 1348 Part V . Putting JavaScript to Work

Tuesday, January 15th, 2008

1348 Part V . Putting JavaScript to Work the entire outline HTML to be assigned to the innerHTML property of the empty DIV element delivered with the document. // initialize first time function init(outlineID) { if (supportVerified(outlineID)) { // demo how to get outline head elements var hdr = document.getElementById(outlineID).getElementsByTagName( head )[0] // get outline body elements for iterative conversion to HTML var ol = document.getElementById(outlineID).getElementsByTagName( body )[0] // wrap whole outline HTML in a span var olHTML = + makeHTML(outlineID, ol) + // throw HTML into content DIV for display document.getElementById( content ).innerHTML = olHTML initExpand(outlineID) } } Validation of browser support is handled by the supportVerified() function. This function is in search of the XMLDocumentproperty of the XML element object. The property s presence indicates that the browser has what it takes to treat embedded XML as a data island. Incremental tests are needed so that earlier browsers don t choke on the reference to the property. // verify that browser supports XML islands function supportVerified(testID) { if (document.getElementById && document.getElementById(testID) && document.getElementById(testID).XMLDocument) { return true } else { var reply = confirm( This example requires a browser with XML data island support, such as IE5+/Windows. Go back to previous page? ) if (reply) { history.back() } else { return false } } return false } Accumulating the HTML From the init()function, a call to the makeHTML() function starts the most complex actions of the scripts on this page. This function walks the node hierarchy of the outline s BODY elements, deciphering which ones are containers and which ones are end points. Two global variables are used to keep track of how far the node walk progresses because this function calls itself from time to time to handle nested branches of the node tree. Because a reflexive call to a function starts out with new values for local variables, the globals operate as pointers to let statements in the function know which node is being accessed. The numbers get applied to an ID attribute assigned to the DIV elements holding the content.
If you are looking for cheap and quality webhost to host and run your website check Jboss Web Hosting services.

1347Chapter 52 .Application: Outline-Style Table of Contents (Web server address) Also,

Monday, January 14th, 2008

1347Chapter 52 .Application: Outline-Style Table of Contents Also, go back to the top of the document to see the style sheets, which have an important place in delivering an XML island: To prevent the XML block from rendering on the page, the displaystyle property is set to nonefor the XML tag selector. This keeps the page clear for insertion of script-generated HTML. The other style sheet rules apply to content created by the scripts. Setting the scripted stage All scripts for this page are in the HEAD (although they could also be linked in from an external .js file). First on the docket is establishing several global variables that get used a lot within the rest of the code and make it easy to customize important visible properties, especially widget art. Due to the art choices made for this version, there are separate versions for items that appear as first, middle, and end items for different nesting states.

Composition of Selected Foods

Now begins the HTML that defines the content of the outline. For readability, I have formatted the
tag sets to follow the indentation of the outline data (this listing looks much better if you open the file from the CD-ROM in your text editor with word wrap turned off). Each tag includes a CLASS attribute pointing to a class defined in the first ) } Initial settings of the displayproperty for IE4+ can be done programmatically only after the document loads (the tags must exist before their properties can be adjusted). The following init() function is called from the onLoad event handler. Each browser class has a different set of initialization tasks. Both branches rely on the current state setting, so that value is retrieved just once. In the CSS branch, the style.display properties for hidden blocks are set to none. For NN4, on the other hand, the style.display properties are set as the page reloads, but this loop swaps the widget image for expanded blocks to the minus.gifversion. // for CSS, initialize flagged tags to style display = none // for NN4, set affected images to minus.gif function init() { var visState = getCurrState() if (isCSS) { for (var i = 0; i < visState.length; i++) { if (visState.charAt(i) == 0 ) { // branch for browser object capability if (document.all) { document.all( a + i).style.display = none } else if (document.getElementsByTagName) { document.getElementById( a + i).style.display = none } } } } else if (isNN4) { for (i = 0; i < visState.length; i++) {
You want to have a cheap webhost for your apache application, then check apache web hosting services.

1339Chapter 52 .Application: Outline-Style (Web hosting uk) Table of Contents browser-specific

Thursday, January 10th, 2008

1339Chapter 52 .Application: Outline-Style Table of Contents browser-specific branches use a great deal of the code. Inside the large for loop, a CSS branch dynamically changes the setting of the style.display property. For NN4, the page is reloaded after all changes to the cookie version of the state are saved. After the NN4 version goes off to reload the page, the CSS version swaps the image of the toggled widget. As a final touch, the window is given focus so that IE/Windows browsers lose the dotted rectangle around the clicked image. // **function that updates persistent storage of state** // toggles an outline mother entry, storing new value function toggle() { var newString = var expanded, n // get all

tag objects in IE4/W3C DOMs if (document.all) { var allDivs = document.all.tags( DIV ) } else if (document.getElementsByTagName) { var allDivs = document.getElementsByTagName( DIV ) } var currState = getCurrState() // of whole outline // assemble new state string based on passed parameters for (var i = 0; i < arguments.length; i++) { n = arguments[i] expanded = currState.charAt(n) // of clicked item newString += currState.substring(0,n) newString += expanded ^ 1 // Bitwise XOR clicked item newString += currState.substring(n+1,currState.length) currState = newString newString = if (isCSS) { // dynamically change display style without reloading if (expanded == 0 ) { allDivs[n].style.display = block } else { allDivs[n].style.display = none } } } setCurrState(currState) // write new state back to cookie if (isNN4) { location.reload() } // swap images in CSS versions var img = document.images[ widget + (arguments[0]-1)] img.src = (img.src.indexOf( plus.gif ) != -1) ? minus.gif : plus.gif window.focus() } A prerequisite for loading the page to begin with is setting the initial value of the state. This is the only part of the script that must be hard-wired based on the structure of the outline string assigned to initState will be different with each outline. The goal here is to set each block assigned to the indent0 style class to 1
Note: If you are looking for cheap and reliable webhost to host and run your mysql application check mysql web server services.

« Previous Entries
Next Entries »