Recent Notes

Displaying keyword search results 1 - 7
Created by Dr. Xi on January 22, 2011 20:26:05    Last update: January 22, 2011 20:26:05
Deciding which one to use is not that easy. Chrome and Safari always use document.body.scrollTop , while IE and Firefox use document.body.scrollTop for quirks mode and document.documentElement.scrollTop for standard mode. Your best bet may be something like: var scrollTop = document.body.scrollTop || doc... Test page for quirks mode: <html> <head> <title>Quirks Mode</title> ... Test page for standard mode: <!doctype html> <html> <head> <title>Sta...
Created by James on July 19, 2009 20:51:23    Last update: January 11, 2011 20:14:18
If CSS3 border-image is properly supported, making a rounded corner box is very easy. You just need a round corner image like this: The following markup: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" ... would render like this (try it in Firefox 3.5 and Google Chrome): However, IE as of version 8.0 does not support border-image . So until border-image is reliably supported in all major browsers, we still have to rely on tried and true tricks to make it work. In general, I found three general categories of tricks to make rounded corners: Good old tables. This trick creates a table of 9 cells and uses the 8 cells on the perimeter to render the borders and rounded corners. The central cell is used for...
Created by James on May 24, 2009 20:14:25    Last update: January 11, 2011 20:07:38
In the following HTML code, I attached an inline handler to the text field input and added two event handlers with addEventListener / attachEvent . Both IE and Firefox called the inline handler first. But the order in which the added event handlers were called are different between IE and Firefox (IE calls attached_click2 first). Further, if I add the same event handler multiple times, IE calls the handler the same number of times. But Firefox only calls the same handler once, no matter how many times it was added. <html> <body> <form> Input: <input type="... You can attach an event handler to an HTML element either inline , with JavaScript , or by calling addEventListener (DOM level 2), or attachEvent (IE specific). When you...
Created by James on October 06, 2010 20:54:39    Last update: October 06, 2010 20:55:00
When a JavaScript call is taking too much time, Firefox pops up this message: Of course the solution is to speed up your script. But suppose it really needs to exceed the preset timeout, you can delay the popup by following these steps: Enter about:config in the address bar Ignore the warning and proceed Enter dom.max_chrom in the filter input Change the value of dom.max_chrome_script_run_time to a bigger value (default is 20). For IE, there's a similar dialog with this message: "A script on this page is causing Internet Explorer to run slowly". But rather than counting elapsed time, IE counts the number of statements executed , which is controlled by the registry key HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Styles . You need to create a DWORD value named...
Created by James on October 11, 2009 21:15:53    Last update: October 11, 2009 21:19:39
Many techniques for making rounded corners do not work well when the element being rounded is displayed on a background with a different color (or multiple colors). Example 1: Nifty Cube with JavaScript <html> <head> <base href="http://www.html.i... Example 2: modx Simple Rounded Corner Box <html> <head> <title>Round Corner</title> ... Example 3: CSS3 (does not work in IE) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" ... Example 4: This is one that actually works ! The nifty corner technique can be tweaked to be background friendly, although the JavaScript version didn't work for some reason. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" ...
Created by Dr. Xi on September 07, 2008 21:14:46    Last update: September 07, 2008 21:14:46
In the simplest form, JavaScript debugging is simply looking at the JavaScript error messages. For IE, there's a yellow mark at the left bottom screen of the browser when a JavaScript error occurs. For Firefox, you need to enter javascript: in the address bar to see the JavaScript errors. These simple tools aren't enough when your JavaScript s become less simple. For IE, you can use the "Microsoft Script Debugger" or "Microsoft Script Editor", which comes with Microsoft Office. This is a pretty good tutorial on the subject: http://www.jonathanboutelle.com/mt/archives/2006/01/howto_debug_jav.html For Firefox, I use firebug , which not only allows you to debug JavaScript, but also to inspect the HTML, DOM and CSS on the page. I use it a lot to modify the CSS on...
Created by Dr. Xi on August 10, 2007 20:43:10    Last update: August 10, 2007 20:43:10
IE and firefox both support client side XSLT. This can be done by inserting an xml-stylesheet into the XML file, which would trigger the browser to apply the XSL to the XML document and generate a transformed page: <?xml version="1.0" encoding="utf-8" ?> <?... Or, it can be done more dynamically with client side JavaScript. However, IE and FF offer different APIs for XSLT. Below is my attempt to bridge the differences. It's been tested to work for IE 7.0, FF 2.0 and Opera 9.0.2. function XSLT(url) { var xslt = false; ... The following HTML page shows how to use it: <HTML> <HEAD> <SCRIPT language="JavaS...