Recent Notes

Displaying keyword search results 1 - 6
Created by Dr. Xi on August 31, 2008 20:43:44    Last update: January 22, 2011 12:48:08
It's probably more useful to make the JavaScript executor a bookmarklet. That way it gains access to the page on which it is invoked. Therefore, more helpful while debugging. Here's the code: <html> <body> <a href="javascript:(funct... Or, you can add this link to your bookmarks, name it "JS Executor". For a full featured JavaScript console, you may need Jash
Created by Dr. Xi on October 26, 2010 04:47:37    Last update: January 11, 2011 20:00:36
The code presented here is a simple implementation of a tab set. It is used to demo how a tab set could be implemented. The code is stand alone and does not depend on any JavaScript libraries. Multiple tab sets within the same page is supported. The HTML markup is fairly simple: Tabs sets are contained within a DIV element with class name "tabsContainer". Define a UL list for the tabs. Follow the UL list with equal number of DIVs for the tab contents. The Nifty Corners Cube technique is used to draw the rounded corners (original form, not the enhanced JavaScript form). HTML, CSS and JavaScript: <!doctype html> <html> <head> <style typ...
Created by Dr. Xi on November 03, 2007 17:36:24    Last update: January 10, 2011 22:22:43
When rendering an HTML form, it is customary to use an icon to indicate that a field is required. You can render the icon in HTML directly, but it's a lot more convenient to use CSS. Here's the CSS: label.required { background: url(/img/requ... And the HTML: <label class="required">A required field</labe...
Created by Fang on August 10, 2010 21:37:36    Last update: October 25, 2010 20:18:47
The tags <fmt:formatNumber> Format a numeric value as number , currency or percentage - controlled by the type attribute (defaults to number if type is missing). Syntax: <fmt:formatNumber value="numericValue" [type="... Attributes: Name Dynamic? Type Description value true String or Number Numeric value to be formatted. type true String Specifies whether the value is to be formatted as number, currency, or percentage. pattern true String Custom formatting pattern, must follow the pattern syntax specified by the class java.text.DecimalFormat . currencyCode true String ISO 4217 currency code. Applied only when formatting currencies (i.e. if type is equal to "currency"); ignored otherwise. currencySymbol true String Currency symbol. Applied only when formatting currencies (i.e. if type is equal to "currency"); ignored otherwise. It is used only when currencyCode is...
Created by Fang on April 04, 2010 04:12:14    Last update: July 21, 2010 14:52:58
The tags <c:if> The <c:if> tag may be used with or without body content: <!-- Without body content, used to export vari... In my opinion, the version without body content is pretty much useless (the <c:set> tag is a lot more meaningful for this purpose). If body content exists, it is inserted into the page if the testCondition is true . Optional attributes var and scope may be specified. If var is specified, a variable whose name is the value of var is exported to the associated scope ( pageScope if no scope is specified). The type of the exported variable is Boolean and its value is the value of the testCondition . <c:choose>, <c:when>, <c:otherwise> These tags imitate the Java control structure if...else...
Created by James on May 07, 2010 04:13:14    Last update: May 07, 2010 04:35:03
It seems that the key to aligning a checkbox with its label lies in the line-height property of the label. This simple HTML snippet aligns well: <!DOCTYPE HTML> <html> <head> <style typ... which is rendered like this: Change the font size of the label to 12px throws off the alignment: label.checkbox { font-size: 12px; di... In case 1, the height of the checkbox is 13px with 3px top and bottom margin, for a total of 19px , which is exactly the height of the label div. As can be seen from Firebug : Checkbox layout Label layout In case 2, the height of the label div shrinks to 15px , while the height of the checkbox remains the same: Checkbox layout Label layout And...