UI:What Ix:How UX:Why :: Think Product Design

Ok. It's been a while I have not posted here. The main reason is I am not THAT interested in DHTML these days since I joined Packeteer . I immediately started to learn and develop on Adobe Flex 2 and Apollo (which is called AIR now). For the last three months I've learned many tricks how to make actual application work, how to build web site on it, and make it dynamic. Just want let you know I am here, not actually looking for another job, and probably will start postings about Flex, because it is really COOL. Cheers.

For dynamic pages sometimes you can't say in advance what exact content will be, and therefor you have no control of actual content, for example words can be very long, and not wrappable by browser. For this purposes I use special zero-width space (x200B) which exists in HTML specs. I wrote a function which you call on strings whenever you need it: yourStr.HTMLwrap() Here it is: /** Add zero-width spaces every 10 characters */ String.prototype.HTMLwrap = function() { var i = 0; var a = ''; var len = this.length; while(len > i*10+10) { a += this.substr(i*10, 10) + '\u200B' i++; } return a + (i>0?this.substring(i*10, this.length):this); }

First, create area where results will be output. You can adjust any style property to fit your needs. Minimum what you need to change is "parentNodeId": // Test env function testEnv() {  var parentNode = document.getElementById("parentNodeId");  if (parentNode) {   var testNode = document.createElement("div");   testNode.id = "testEnv";   testNode.style.height = "7em";   testNode.style.backgroundColor = "white";   testNode.style.overflow = "auto";   testNode.style.border = "1px solid #778899";   testNode.style.textAlign = "left";   testNode.style.overflowX = "hidden";   testNode.style.whiteSpace = "nowrap";   parentNode.appendChild(testNode);  } } Then, in the function or any piece of the code you are testing, write: in the beginning: var beginTime = new Date().valueOf(); and finally, at the end: if (document.getElementById("testEnv"))   document.getElementById("...

In Internet Explorer 6 there is the way to close window by javascript without warning: "The webpage you are viewing is trying to close this window": window.opener = top; window.close(); But not in IE 7 unless window was opened by your javascript from other window.

Suppose you have an input field and you need FilerTag function be performed each time user types a character. Below are two approaches for this. Native browser approach: if (a.addEventListener) {a.addEventListener("keyup", FilterTags, false)} // firefox else if (a.attachEvent) {a.attachEvent("onpropertychange", FilterTags)} // ie YUI approach: YAHOO.util.Event.addListener(a, "keyup", FilterTags);

At the end of the page add this javascript: function enterPressed(evn) { if (window.event && window.event.keyCode == 13) { alert("IE: Enter is pressed"); } else if (evn && evn.keyCode == 13) { alert("Netscape: Enter is pressed"); } } document.onkeypress = enterPressed; UPDATE Here is modified cross browser version of the code above: function doWhenEnterPressed(evn) { var enterWasPressed = false; if (window.event && window.event.keyCode == 13) { // IE enterWasPressed = true; } else if (evn && (evn.keyCode == 13 || evn.which == 13 )) { // FF enterWasPressed = true; } if (enterWasPressed) { alert('Enter pressed'); // your action code } } document.onkeydown = function(evn) { doWhenEnterPressed(evn); }

Cross browser function to get element(s) by "name" attribute. /** getElementsByTagAndName: to avoid missing getElementsByName in IE */ function getElementsByTagAndName(tag, name) {     var elem = document.getElementsByTagName(tag);     var arr = new Array();     for(i = 0, iarr = 0; i         att = elem[i].getAttribute("name");         if(att == name) {             arr[iarr] = elem[i];             iarr++;         }     }     return arr; }