Đang chuẩn bị liên kết để tải về tài liệu:
DHTML Utopia Modern Web Design Using JavaScript & DOM- P14

DHTML Utopia Modern Web Design Using JavaScript & DOM- P14:In a single decade, the Web has evolved from a simple method of delivering technical documents to an essential part of daily life, making and breaking relationships and fortunes along the way. “Looking something up on the Internet,” by which is almost always meant the Web, is now within reach of almost anyone living in a first-world country, and the idea of conducting conversations and business (and probably orchestras) in your Web browser is no longer foreign, but part of life | Chapter 8 Remote Scripting a width 100 IE Hack h2 width 100 IE Hack These styles align the two divs left-to-right by floating them against the left side of the page. To prevent whitespace from appearing underneath each li in Internet Explorer we use the trick we saw in Chapter 7 set the li contents to occupy the full width of the li. That wrecks the layout slightly for standards-compliant browsers so we set overflow hidden to tidy up there. Planning the DHTML Beer Pages Let s update this tiny application so that it doesn t need to send us off to different pages for information. We ll add a new section to the page itself to display data about a particular beer and we ll change it so that clicking a beer character highlights it and all the beers that have it. These are the steps we ll take 1. Generate the page dynamically based on server data. 2. Add a new page element in which beer descriptions will be displayed. 3. Create a script to fetch data on an individual beer from the server. 4. Create a script to display the data from step 3 in the new section on the page. 5. Create a script to fetch data about which beers share a particular character. 6. Create a script to highlight those beers that are indicated by data from step 5. As usual we ll require a set of JavaScript methods so let s jump forward for a second and see what those are going to look like 240 Licensed to siowchen@darke.biz Generating the Starting Page from Data File final-beer.js excerpt bG init function . addEvent function elm evType fn useCapture . geturl function u fn . clickCharacter function e . clickBeer function e . display function beer . display2 function beerdata . highlight function character . highlight2 function charjs . bG.addEvent window load bG.init false geturl will draw data back from the server. The click. methods are event listeners. display and display2 drive the beer selection feature and highlight and highlight2 drive the character highlighting feature. But one step at a time is