Hi everyone.
I'm having problem with firefox only but it works when i delete document definition that is my code:
[HTML]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt d">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitl ed Document</title>
</head>
<script language="javas cript">
function coloringText(){
var allText=documen t.getElementsBy TagName("input" );
for(i=0;i<allTe xt.length;i++){
var type=allText[i].getAttribute(" type");
if(type=='text' || type=='password '){
var thisElement=all Text[i];
allText[i].style.border=" 1px solid #999";
allText[i].style.backgrou ndColor="#FFF";
allText[i].onfocus=functi on Coloring(){
this.style.bord er="1px solid #98C9FE";
this.style.back groundColor="#F 4FAFF";
document.getEle mentById('info' ).style.display =''
document.getEle mentById('info' ).innerHTML = this.alt
var coords = getCoords(this) ;
document.getEle mentById('info' ).style.top = coords.y - 10
document.getEle mentById('info' ).style.left = coords.x + 180
}
allText[i].onblur=functio n Coloring(){
this.style.bord er="1px solid #999";
this.style.back groundColor="#F FF";
document.getEle mentById('info' ).style.display = 'none'
}
}
}
}
function getCoords(eleme nt){
var coords = { x: 0, y: 0, width: element.offsetW idth, height:element. offsetHeight };
while (element) {
coords.x += element.offsetL eft;
coords.y += element.offsetT op;
element = element.offsetP arent;
}
return coords;
}
</script>
<body onload="colorin gText();">
<form id="form1" name="form1" method="post" action="">
<div id="info" style="display: none; position:absolu te; background:#BBB BBB; padding:10px; color:#FFFFFF;" ></div>
<table width="700" border="0" align="center" cellpadding="3" cellspacing="3" >
<tr>
<td width="146"><in put type="text" name="textfield " id="textfield" alt="hello people!!"/></td>
</tr>
<tr>
<td><input type="text" name="textfield 2" id="textfield2 " alt="text hello human!!"/></td>
</tr>
<tr>
<td><input type="text" name="textfield 3" id="textfield3 " alt="hello people!!"/></td>
</tr>
<tr>
<td><input type="text" name="textfield 4" id="textfield4 " alt="hello people!!"/></td>
</tr>
</table>
</form>
</body>
</html>[/HTML]
Many thanks.
I'm having problem with firefox only but it works when i delete document definition that is my code:
[HTML]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt d">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitl ed Document</title>
</head>
<script language="javas cript">
function coloringText(){
var allText=documen t.getElementsBy TagName("input" );
for(i=0;i<allTe xt.length;i++){
var type=allText[i].getAttribute(" type");
if(type=='text' || type=='password '){
var thisElement=all Text[i];
allText[i].style.border=" 1px solid #999";
allText[i].style.backgrou ndColor="#FFF";
allText[i].onfocus=functi on Coloring(){
this.style.bord er="1px solid #98C9FE";
this.style.back groundColor="#F 4FAFF";
document.getEle mentById('info' ).style.display =''
document.getEle mentById('info' ).innerHTML = this.alt
var coords = getCoords(this) ;
document.getEle mentById('info' ).style.top = coords.y - 10
document.getEle mentById('info' ).style.left = coords.x + 180
}
allText[i].onblur=functio n Coloring(){
this.style.bord er="1px solid #999";
this.style.back groundColor="#F FF";
document.getEle mentById('info' ).style.display = 'none'
}
}
}
}
function getCoords(eleme nt){
var coords = { x: 0, y: 0, width: element.offsetW idth, height:element. offsetHeight };
while (element) {
coords.x += element.offsetL eft;
coords.y += element.offsetT op;
element = element.offsetP arent;
}
return coords;
}
</script>
<body onload="colorin gText();">
<form id="form1" name="form1" method="post" action="">
<div id="info" style="display: none; position:absolu te; background:#BBB BBB; padding:10px; color:#FFFFFF;" ></div>
<table width="700" border="0" align="center" cellpadding="3" cellspacing="3" >
<tr>
<td width="146"><in put type="text" name="textfield " id="textfield" alt="hello people!!"/></td>
</tr>
<tr>
<td><input type="text" name="textfield 2" id="textfield2 " alt="text hello human!!"/></td>
</tr>
<tr>
<td><input type="text" name="textfield 3" id="textfield3 " alt="hello people!!"/></td>
</tr>
<tr>
<td><input type="text" name="textfield 4" id="textfield4 " alt="hello people!!"/></td>
</tr>
</table>
</form>
</body>
</html>[/HTML]
Many thanks.
Comment