hand/pointer cursor

a, a:hover, td a:hover{
cursor: pointer;
cursor: hand;
}

or in js:
div.style.cursor=”pointer”;//for Firefox
div.style.cursor=”hand”;//for IE

Create array inside class

In most situations (although I haven’t figure out in which situations), as a member of a class, instance variables that are type of array needs to be declared either in the constructor or in other methods of the class, instead of being constructed in the instance variable declaration.

So instead of doing:

class SlideTray extends UIComponent{

__inSlidesArray:Array = new Array();

…

}

We need to say:

class SlideTray extends UIComponent{

var __inSlidesArray:Array;

function SlideTray(){

__inSlidesArray = new Array();

}

…

}

This way, whenever a new instance of SlideTray is created, a fresh empty, new __inSlidesArray array is created. Otherwise, if an array instance is instantiated using instance “var __inSlidesArray :Array=new Array();” statement and if a second instance of SlideTray is created after the first one, its __inSlidesArray will “inherit” the value of the first one!

It’s a surprising discovery that took me about 2 hours to figure out.

My experiment is as follows:

//test class

class TestArray{

//purposefully declare the array before the constructor

var __TA:Array = new Array();

var __NUM:Numer = 7;

function TestArray(){

trace(”number is “+__NUM.toString());

}

public function addItem(o:Object):Void{

__TA.push(o);

}

public function addNum(v:Number):Void{

__NUM += v;

}

public function toString():String{

var arr:String = “array: ” +__TA.toString();

var num:String = “number: “+__NUM.toString();

var info:String = arr+” || “+num;

}

}

//main app

var testArray:TestArray = new TestArray();

testArray.addItem(”haha”);

testArray.addItem(233);

testArray.addNum(12);

//output: ‘array: haha,233 || number: 12′;

trace(”testArray: “+testArray.toString());

var testArray2:TestArray = new TestArray();

//output: ‘array: haha, 233 || number: 7′;

trace(testArray2.toString());

The point is that the array in the newly created object, if created the way as described above, will remain as the same value as that of the last created instance. Debugging work like this will generally take 0.5 - 2 - 4 hours.

So the right way is  to create arrays inside methods/class constructors instead of in instance variable statements.

loading another iframe from the parent

to refer to the parent from within iframe:

var parent = window.parent;

to  refert to the iframe from within the parent:

var iframe= window.all.iframeEl;

//the url of the iframe
var url = iframe.src

Flash object background

if wmode of the flash object property is “opaque”, the
bgcolor property also needs to be explicitly set in the form of hexadecimals.

If the flash object resides in a table, the table’s (or the table cell /td) bgcolor also needs to be set.

background-image url in css

the url in the background/background-image rule is relative to the css file. E.i.,

background:url(../img/delete.gif) no-repeat top left;

The above css file is in folder “css” which is the same level as “img” where the gif is in.

Basic mySQL commands

Establishing a DB connection, with PHP

1. mysql_connect()

2. mysql_select_db()

3. mysql_query()

4. mysql_fetch_array()

5. mysql_result()

6. mysql_error()

Basic SQL commands

CREATE TABLE

ALTER TABLE CHANGE/ADD/DROP

DROP TABLE

INSERT INTO ( , , , … ) VALUES ( , , , …);

UPDATE WHERE

SELECT FROM WHERE WHERE/GROUP BY/HAVING/ORDER BY LIMIT…

DELETE FROM WHERE

javascript list object

I got two quick and dirty ways to build a list/array type of object in js:

1. javascript object literals

2. javascript array literals

In the first way, to build a javascript object literal: var listObj = new Object();

To extend the list, you don’t need to call any methods in javascript object, instead simply do: listObj["id4"] = {name:”tsi chuan”, phone:”312-222-222″};

It’s not easy to figure out how many objects are within the current list.

In the second way,

var listArr = new Array();

listArr[0] = {name:”tsi chuan”, phone:”312-222-222″};

listArr[2] = {name:”tsi chuan NEW”, phone:”312-222-333″};
//listArr.length will be 3.
It’s easy to sort the array list by index number and to figure out how many objects are really inside the list, like so:

if(listArr[2]["name"]!=undefined){//the obj exists.}

Since we are not using any methods on the objects, there is no way to keep track of the length property of the array object once this approach is used.

tbody scroll for IE

by ofir

http://www.webdeveloper.com/forum/showthread.php?t=92584

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

<html>
<head>
<meta http-equiv=“content-type” content=“text/html; charset=iso-8859-1″ />
<title>website</title>
<style type=‘text/css’>
body{
padding:0;
margin: 20px;
font: normal 13px arial, sans-serif;
}

table.TableMain{
border: 1px solid black;
}

thead tr th, tfoot tr th{
background-color: #996600;
}

.scrollTable th, .scrollTable td{
padding: 5px;
border: solid black;
border-width: 0 1px 1px 0;
}

.scrollTable{ width:100% }

.scrollTable > tbody{
height:300px;
overflow:auto;
}

.scrollTable .th_extra{
width: 18px;
padding: 0;
border-right-width: 0;
}

.TableContainer > .scrollTable .th_extra{ width: 19px; }

</style>
<!–[if IE]>
<style type=“text/css”>
div.TableContainer {
height: 300px;
overflow: auto;
width: 100%;
}

thead.fixedHeader tr {
position: relative;
}
.scrollTable{width: expression(this.parentNode.offsetWidth-17);}
.th_extra{display:none;}
</style>
<![endif]–>

</head>

<body>

<table border=‘0′ cellspacing=‘0′ cellpadding=‘0′ class=‘TableMain’ width=‘60%’>
<tr>
<td>
<div class=“TableContainer”>
<table border=‘0′ cellspacing=‘0′ cellpadding=‘0′ class=“scrollTable”>
<thead class=“fixedHeader”>
<tr>
<th>wkdjchlkj</th>
<th>khwdgc9376</th>
<th>76235uyg</th>
<th>yg</th>
<th class=‘th_extra’></th>
</tr>
</thead>
<tfoot>
<tr>
<th>wkdjchlkj</th>
<th>khwdgc9376</th>
<th>76235uyg</th>
<th>7</th>
<th class=‘th_extra’></th>
</tr>
</tfoot>
<tbody class=“scrollContent”>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
<tr>
<td>1111111111</td>
<td>JAh RAsta</td>
<td>222</td>
<td>444444444444</td>
</tr>
</tbody>
</table>
</div>

</td>
</tr>
</table>

</body>
</html>

Make a CSS inpage “popup”

To make a CSS “popup” such as those for “login”, you need two divs:

one is semitransparent and one is not,with the latter sitting on top of the former. Like so:

#semitranslayer {
		display: none;
		position: absolute;
		top: 45px;
		left: 0;
		margin: 0 0 -1500px;
		height: 1px;
		font-size: 0;
		width: 100%;
		height: 100%;
		background: #042f51;
		z-index: 10050;
		opacity: .7;
		filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);
	}

Keep Flash object underneath other divs

Use the following properties for Flash object, as well as set z-index rule for the Flash div to lower number (like 0):

<param name=“wmode” value=“opaque” />

<embed wmode=“opaque” />