Essentials of Javascript - Cultural View
Essentials of Javascript - Cultural View Essentials of Javascript - Cultural View
JsonML 109 }} "modified": "2006-12-31T23:59" Comparison To Similar Technologies XML/XSLT XSLT and XML can produce client-side templating as well, and both allow caching of the template separate from the data. For many, however, the syntax of JBST [2] is much easier to manage, due to its familiarity. JBST uses JavaScript natively in the template rather than requiring a mixing of a different type of control language. innerHTML While seemingly used to perform similar tasks, JsonML and innerHTML are quite different. innerHTML requires you to have all the markup exactly as you want it ready to go, meaning that either the server is rendering the markup, or you are performing expensive string concatenations in JavaScript. JsonML uses client-side templating through JBST, which means that HTML is converted into a JavaScript template at build time. At runtime, the data is supplied and DOM elements are the result. The resulting DOM elements can be inserted or replace an existing element—something innerHTML cannot easily do without creating excess DOM elements. Rebinding only requires requesting additional data, which is smaller than fully-expanded markup. As a result, large performance gains are often made, since the markup is requested (or cached) separately from the data. HTML Message Pattern / Browser-Side Templating For simplicity, innerHTML has been the preferred method for the HTML-Message pattern [5] style of Ajax. However, tools like JsonFx [6] aim to simplify JsonML and JBST implementation while still providing a full browser-side templating Ajax pattern. [7] External links • JsonML.org [8] • IBM developerWorks Article [9] • Java JSONML implementation [10] - written by Douglas Crockford • JsonFx.NET [11] - C#/.NET JBST Framework References [1] http://jsonml.org/Ajax-UI/Binding/ [2] http://jsonml.org/bst [3] http://jsonml.org/BST/Example [4] http://tech.groups.yahoo.com/group/json/message/1115 [5] http://ajaxpatterns.org/HTML_Message [6] http://jsonfx.net [7] http://ajaxpatterns.org/Browser-Side_Templating [8] http://jsonml.org [9] http://www.ibm.com/developerworks/library/x-jsonml/ [10] http://json.org/javadoc/org/json/JSONML.html [11] http://jsonfx.googlecode.com
Lightbox (JavaScript) 110 Lightbox (JavaScript) A webpage showing a Lightbox 2 window. Developer(s) Lokesh Dhakar Stable release 2.04 / March 9, 2008 Development status Stable Operating system Cross-platform Available in English License Creative Commons Attribution 2.5 License Website [1] Lightbox, and the newer Lightbox 2, is a JavaScript application used to display large images using modal dialogs. The script has gained widespread popularity due to its simple yet elegant style and easy implementation. While it was initially developed from scratch, Lightbox has since been modified to use a number of JavaScript libraries (such as the Prototype Javascript Framework [2] and script.aculo.us [3] for its animations and positioning), in order to reduce the size of the code. [4] The release of Lightbox encouraged other developers to work on similar projects, resulting in products such as the later Thickbox and lighter Slimbox. [4] How it works On a Lightbox-enabled page, a user can click an image to have it magnified in a Lightbox window, which resizes itself according to the size of the image using a gliding animation. Lightbox determines which images will be shown in the modal window through the XHTML "rel" attribute, which is used on an element wrapped around the element. Lightbox also provides a way to attach captions to images and to run a slide show, which can be navigated using the arrow keys. Functionality Lightbox permits users to view larger versions of images without having to leave the current page, [5] and is also able to display simple slideshows. The use of the dark background, which dims the page over which the image has been overlaid, also serves to highlight the image being viewed. While Lightbox is dependent upon a browser's compatibility with Prototype to function, [3] Lightbox is triggered through a standard link tag. Thus browsers that do not support JavaScript simply load the image as a separate file, losing the Lightbox effect but still retaining the ability to display the full-sized image. [5] Even so, some compatibility problems have been identified with versions of Lightbox, in particular when displaying larger images on Firefox or Opera. [6] Many users have also noted that there is a lack of compatibility across the Internet Explorer range of browsers. However, many times the compatibility issues can be attributed to users not reading the documentation on how to make lightbox function correctly in these browsers.
- Page 61 and 62: Appcelerator Titanium 58 See also
- Page 63 and 64: Bookmarklet 60 Bookmarklet A bookma
- Page 65 and 66: Bookmarklet 62 References [1] Domai
- Page 67 and 68: Client-side JavaScript 64 implement
- Page 69 and 70: Client-side JavaScript 66 Reference
- Page 71 and 72: dhtmlx [1] Comparison of JavaScript
- Page 73 and 74: ility / ion Comparison of JavaScrip
- Page 75 and 76: Comparison of JavaScript frameworks
- Page 77 and 78: Comparison of JavaScript frameworks
- Page 79 and 80: Comparison of JavaScript-based sour
- Page 81 and 82: Comparison of JavaScript-based sour
- Page 83 and 84: Douglas Crockford 80 Douglas Crockf
- Page 85 and 86: DWR (Java) 82 DWR (Java) Developer(
- Page 87 and 88: EMVC 84 EMVC Developer(s) Ed Hertzo
- Page 89 and 90: Brendan Eich 86 References [1] Stev
- Page 91 and 92: JSDoc 88 JSDoc JSDoc is a syntax fo
- Page 93 and 94: JSDoc 90 History The earliest examp
- Page 95 and 96: JSSP 92 JSSP JSSP, or JavaScript Se
- Page 97 and 98: JScript 94 JScript is sometimes ref
- Page 99 and 100: JScript 96 [9] http://msdn2.microso
- Page 101 and 102: JSON 98 JSON Filename extension .js
- Page 103 and 104: JSON 100 Using JSON in Ajax The fol
- Page 105 and 106: JSON 102 /> state='NY' postalCode='
- Page 107 and 108: JSON 104 parseResponse({"Name": "Ch
- Page 109 and 110: JSON 106 [21] Ben-Kiki, Oren; Evans
- Page 111: JsonML 108 ["person", {"created":"
- Page 115 and 116: Lively Kernel 112 Lively Kernel Liv
- Page 117 and 118: Lively Kernel 114 The Lively Wiki T
- Page 119 and 120: Lively Kernel 116 }); } External li
- Page 121 and 122: Minification (programming) 118 Mini
- Page 123 and 124: Objective-J 120 Objective-J Paradig
- Page 125 and 126: John Resig 122 John Resig John Resi
- Page 127 and 128: Reverse Ajax 124 External links •
- Page 129 and 130: Seed (programming) 126 Seed (progra
- Page 131 and 132: Seed (programming) 128 See also •
- Page 133 and 134: Comparison of Server-side JavaScrip
- Page 135 and 136: Comparison of Server-side JavaScrip
- Page 137 and 138: Comparison of Server-side JavaScrip
- Page 139 and 140: SproutCore 136 • Tasks. Tasks man
- Page 141 and 142: Unobtrusive JavaScript 138 }); Beca
- Page 143 and 144: Venkman 140 External links • Venk
- Page 145 and 146: XMLHttpRequest 142 Microsoft added
- Page 147 and 148: XMLHttpRequest 144 The send method
- Page 149 and 150: XMLHttpRequest 146 [21] "Specificat
- Page 151 and 152: Article Sources and Contributors 14
- Page 153 and 154: Article Sources and Contributors 15
- Page 155: License 152 License Creative Common
Lightbox (JavaScript) 110<br />
Lightbox (JavaScript)<br />
A webpage showing a Lightbox 2 window.<br />
Developer(s) Lokesh Dhakar<br />
Stable release 2.04 / March 9, 2008<br />
Development status Stable<br />
Operating system Cross-platform<br />
Available in English<br />
License Creative Commons Attribution 2.5 License<br />
Website [1]<br />
Lightbox, and the newer Lightbox 2, is a JavaScript application used to display large images using modal dialogs.<br />
The script has gained widespread popularity due to its simple yet elegant style and easy implementation. While it<br />
was initially developed from scratch, Lightbox has since been modified to use a number <strong>of</strong> JavaScript libraries (such<br />
as the Prototype <strong>Javascript</strong> Framework [2] and script.aculo.us [3] for its animations and positioning), in order to reduce<br />
the size <strong>of</strong> the code. [4] The release <strong>of</strong> Lightbox encouraged other developers to work on similar projects, resulting in<br />
products such as the later Thickbox and lighter Slimbox. [4]<br />
How it works<br />
On a Lightbox-enabled page, a user can click an image to have it magnified in a Lightbox window, which resizes<br />
itself according to the size <strong>of</strong> the image using a gliding animation. Lightbox determines which images will be shown<br />
in the modal window through the XHTML "rel" attribute, which is used on an element wrapped around the<br />
element. Lightbox also provides a way to attach captions to images and to run a slide show, which can be<br />
navigated using the arrow keys.<br />
Functionality<br />
Lightbox permits users to view larger versions <strong>of</strong> images without having to leave the current page, [5] and is also able<br />
to display simple slideshows. The use <strong>of</strong> the dark background, which dims the page over which the image has been<br />
overlaid, also serves to highlight the image being viewed.<br />
While Lightbox is dependent upon a browser's compatibility with Prototype to function, [3] Lightbox is triggered<br />
through a standard link tag. Thus browsers that do not support JavaScript simply load the image as a separate file,<br />
losing the Lightbox effect but still retaining the ability to display the full-sized image. [5] Even so, some compatibility<br />
problems have been identified with versions <strong>of</strong> Lightbox, in particular when displaying larger images on Firefox or<br />
Opera. [6]<br />
Many users have also noted that there is a lack <strong>of</strong> compatibility across the Internet Explorer range <strong>of</strong> browsers.<br />
However, many times the compatibility issues can be attributed to users not reading the documentation on how to<br />
make lightbox function correctly in these browsers.
Change language