I want to use the following code:
It works great in firefox 2
but in IE7, once text is entered in the textbox the select boxes start getting glitchy and wont drop down.
How can I fix this in IE7?
[CODE]
<html>
<head>
<style type=”text/css”>
input.prompt {border:1 solid transparent;
background-color:#99ccff;width:70;font-family:arial;font-size:12; color:black;}
td.titlebar { background-color:#FF9F40; color:#0000D2; font-weight:bold;font-family:arial; font-size:12;}
table.promptbox {border:1 solid #ccccff; background-color:#FFFFE6;
color:black;padding-left:2;padding-right:2;padding-bottom:2;font-family:arial; font-size:12;}
input.promptbox {border:1 solid #0000FF; background-color:white;width:100%;font-family:arial;font-size:12;
color:black; }
</style>
<script language=’javascript’>
var response = null
function prompt2(promptpicture, prompttitle, message, sendto) {
promptbox = document.createElement(‘div’);
promptbox.setAttribute (‘id’ , ‘prompt’)
document.getElementsByTagName(‘body’)[0].appendChild(promptbox)
promptbox = eval(“document.getElementById(‘prompt’).style”)
promptbox.position = ‘absolute’
promptbox.top = 100
promptbox.left = 200
promptbox.width = 300
promptbox.border = ‘outset 1 #bbbbbb’
document.getElementById(‘prompt’).innerHTML = “<table cellspacing=’0′ cellpadding=’0′
border=’0′ width=’100%’><tr valign=’middle’><td width=’22’ height=’22’ style=’text-indent:2;’ class=’titlebar’><img src='” +
promptpicture + “‘ height=’18’ width=’18’></td><td class=’titlebar’>” + prompttitle + “</td></tr></table>”
document.getElementById(‘prompt’).innerHTML = document.getElementById(‘prompt’).innerHTML
+ “<table cellspacing=’0′ cellpadding=’0′ border=’0′ width=’100%’ class=’promptbox’><tr><td>” + message +
“</td></tr><tr><td><input type=’text’ id=’promptbox’ onblur=’this.focus()’
class=’promptbox’><br><br><select><option>1</option><option>2</option><option>3</option><option>4</option></select><br><select><op
tion>a</option><option>b</option><option>c</option><option>d</option></select></td></tr><tr><td align=’right’><br><input
type=’button’ class=’prompt’ value=’OK’ onMouseOver=’this.style.border=”1 outset #dddddd”‘ onMouseOut=’this.style.border=”1
solid transparent”‘ onClick='” + sendto + “(document.getElementById(“promptbox”).value);
document.getElementsByTagName(“body”)[0].removeChild(document.getElementById(“prompt”))’> <input type=’button’ class=’prompt’
value=’Cancel’ onMouseOver=’this.style.border=”1 outset transparent”‘ onMouseOut=’this.style.border=”1 solid transparent”‘
onClick='” + sendto + “(“”);
document.getElementsByTagName(“body”)[0].removeChild(document.getElementById(“prompt”))’></td></tr></table>”
document.getElementById(“promptbox”).focus()
}
function myfunction(value) {
if(value.length<=0)
return false;
else
document.getElementById(‘output’).innerHTML=”<b>”+value+”</b>”;
}
</script>
<SCRIPT LANGUAGE=”JavaScript”>
<!–
function callPrompt(){
prompt2(‘btn1p.gif’, ‘My Prompt’,’Please enter your name ,if you want to chat with our <B>customer support
executive</B>’, ‘myfunction’);
}
//–>
</SCRIPT>
</head>
<body>
<input type=”button” value=’show prompt’ onClick=”callPrompt()”> </CENTER>
<div id=”output”
style=”position:absolute;background-color:#transparent;width:200;height:50;left:300;top:150;border:0″></div>
</body>
</html>